/*
===============================================================================
HOMEPAGE CSS - Homepage face only
===============================================================================
KEYWORDS: homepage, homepage CSS, page CSS, CSS split, kc-pro-home,
homepage shell, kc-home-cycle, kc-home-sunday

WHY: The homepage face is large and unique. Keeping it out of
style-kalicube.css means every other public and account page avoids this
payload. Shared public rules still belong in style-kalicube.css.

LOAD:
html/index.prerender.php --> AssetManager::require('homepage')
    --> cssAfter html/css/homepage.css
    --> includes/inc.headkalicube.php after style-kalicube.css

DEPENDS ON:
- html/css/style-kalicube.css for the shared public shell and brand variables
- includes/inc.assetmanager.php feature homepage
- ASSET_VERSION cache stamp passed by includes/inc.headkalicube.php

NEVER:
- Require homepage on a non-homepage
- Put /audit/ or account UI here
- Copy these rules back into style-kalicube.css

CALLS: none.
CALLED BY: AssetManager feature homepage.
INSTANTIATES: none.
IS INSTANTIATED BY: none.

KNOCK-ON EFFECTS:
- Removing the prerender require leaves the homepage unstyled.
- Loading this globally restores about 18 KB to every page.

See also: html/index.prerender.php, includes/inc.assetmanager.php,
includes/inc.headkalicube.php, html/css/style-kalicube.css.
===============================================================================
*/

/* =============================================================================
   HOMEPAGE SHELL — the live editorial homepage face
   =============================================================================
   KEYWORDS: kc-pro-home, homepage shell, weekly cycle SVG, Google Sans Flex
   WHY: This is the homepage's real face, not a reusable public skin. It owns
        the hero, weekly-cycle diagram, data cards, testimonials, team, and
        client strip. Keep it page-scoped and do not revive the discarded
        Metronic ribbon prototype or the old fitPage test zoom.
   ============================================================================= */
.kc-pro-home {
	--kc-navy: #0B1726;
	--kc-ink: #13243A;
	--kc-muted: #3A4A60;
	--kc-label: #52627A;
	--kc-blue: #1F6FA8;
	--kc-sky: #4FA8E0;
	--kc-gold: #E8AA2E;
	--kc-gold-ink: #93590C;
	--kc-gold-line: #BA7517;
	--kc-paper: #F5F8FB;
	--kc-line: #E1E8F0;
	--kc-pro-pad: clamp(1.25rem, 5vw, 5rem);
	--kc-pro-max: 75rem;
	font-family: 'Google Sans Flex', 'Helvetica Neue', Arial, sans-serif;
	color: var(--kc-ink);
	background: var(--kc-paper);
	-webkit-font-smoothing: antialiased;
}

.kc-pro-home a {
	text-decoration: none;
}

.kc-pro-wrap {
	position: relative;
	z-index: 1;
	max-width: var(--kc-pro-max);
	margin: 0 auto;
	padding: 0 var(--kc-pro-pad);
}

.kc-pro-kicker {
	font-size: 0.8125rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--kc-blue);
	font-weight: 500;
	margin: 0 0 1rem;
}

.kc-pro-kicker-on-dark {
	color: var(--kc-sky);
}

.kc-pro-kicker-gold {
	color: var(--kc-gold-ink);
}

.kc-pro-kicker-muted {
	color: var(--kc-label);
}

.kc-pro-btn {
	font-family: 'Google Sans Code', Menlo, monospace;
	display: inline-flex;
	flex-direction: row-reverse;
	align-items: center;
	gap: 0.625rem;
	border-radius: 999px;
	padding: 1.05rem 1.75rem;
	font-size: 1rem;
	font-weight: 500;
	letter-spacing: 0;
	border: 0;
	line-height: 1.2;
	white-space: nowrap;
}

.kc-pro-btn-gold,
.kc-pro-btn-gold:hover,
.kc-pro-btn-gold:focus {
	background: var(--kc-gold);
	color: var(--kc-navy);
}

.kc-pro-btn-ghost,
.kc-pro-btn-ghost:hover,
.kc-pro-btn-ghost:focus {
	background: transparent;
	color: #fff;
	border: 1.5px solid rgba(255, 255, 255, 0.6);
	flex-direction: row;
}

.kc-pro-textlink {
	font-family: 'Google Sans Code', Menlo, monospace;
	display: inline-flex;
	flex-direction: row-reverse;
	align-items: center;
	gap: 0.5rem;
	font-weight: 500;
	color: var(--kc-ink);
	border-bottom: 2px solid var(--kc-sky);
	padding-bottom: 0.15rem;
}

.kc-pro-textlink-gold {
	border-bottom-color: var(--kc-gold-line);
	flex-direction: row;
}

.kc-pro-textlink-on-dark,
.kc-pro-textlink-on-dark:hover {
	color: #fff;
	font-weight: 700;
	border-bottom-color: var(--kc-sky);
}

.kc-pro-textlink-sky,
.kc-pro-textlink-sky:hover {
	color: var(--kc-sky);
	border-bottom-color: var(--kc-sky);
}

.kc-pro-hero {
	position: relative;
	overflow: hidden;
	background-color: var(--kc-navy);
	color: #fff;
	background-image: linear-gradient(rgba(120, 180, 230, 0.07) 1px, transparent 1px), linear-gradient(90deg, rgba(120, 180, 230, 0.07) 1px, transparent 1px);
	background-size: 48px 48px;
}

.kc-pro-home .kc-home-sunday {
	position: absolute;
	top: 0;
	right: 0;
	width: 50%;
	height: 100%;
	margin: 0;
	overflow: hidden;
}

.kc-pro-home .kc-home-sunday-shot {
	display: block;
	width: 100%;
	height: 100%;
	max-height: none;
	object-fit: cover;
	object-position: left center;
	border-radius: 0;
	box-shadow: none;
}

.kc-pro-hero-shade {
	position: absolute;
	inset: 0;
	z-index: 0;
	background: linear-gradient(90deg, rgb(11, 23, 38) 0%, rgb(11, 23, 38) 42%, rgba(11, 23, 38, 0.82) 58%, rgba(11, 23, 38, 0.32) 70%, rgba(11, 23, 38, 0) 82%);
	pointer-events: none;
}

.kc-pro-hero > .kc-pro-wrap {
	max-width: none;
}

.kc-pro-hero-grid {
	display: block;
	position: relative;
	z-index: 1;
	padding-top: 3.75rem;
	padding-bottom: 4rem;
}

@media (min-width: 992px) {
	.kc-pro-hero-grid {
		padding-top: 4.5rem;
		padding-bottom: 4.75rem;
	}
}

.kc-pro-hero-copy {
	position: relative;
	z-index: 1;
	min-width: 0;
	max-width: 72rem;
}

@media (min-width: 992px) {
	.kc-pro-hero-copy .kc-pro-lede,
	.kc-pro-hero-copy .kc-pro-hero-actions,
	.kc-pro-hero-copy .kc-pro-promise {
		max-width: 50rem;
	}
}

.kc-pro-home .kc-pro-hero .kc-heading-page .kc-heading-lead {
	font-size: clamp(2.1rem, 4.6vw, 4rem);
	line-height: 1.03;
	letter-spacing: -0.015em;
	color: #fff;
	margin-bottom: 1rem;
}

.kc-pro-home .kc-pro-hero .kc-heading-title {
	font-size: 1.375rem;
	line-height: 1.4;
	font-weight: 500;
	color: rgba(255, 255, 255, 0.92);
	max-width: none;
	margin-bottom: 1.25rem;
}

.kc-pro-lede {
	font-size: 1.25rem;
	line-height: 1.6;
	max-width: 40rem;
}

.kc-pro-lede-on-dark {
	color: rgba(255, 255, 255, 0.82);
}

.kc-pro-hero-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem;
	padding-top: 0.5rem;
	margin-bottom: 1rem;
}

.kc-pro-hero-actions-center {
	justify-content: center;
}

.kc-pro-promise {
	font-size: 0.95rem;
	color: rgba(255, 255, 255, 0.7);
	margin: 0;
	max-width: 36rem;
	white-space: normal;
}

.kc-pro-home .kc-home-hero-card,
.kc-pro-hero-card {
	position: relative;
	left: auto;
	right: auto;
	bottom: auto;
	width: 100%;
	max-width: 22rem;
	flex-shrink: 0;
	margin: 1.5rem 0 0;
	background: rgba(11, 23, 38, 0.94);
	border: 1px solid rgba(255, 255, 255, 0.14);
	box-shadow: 0 32px 64px rgba(0, 0, 0, 0.38);
	border-radius: 14px;
	padding: 1.15rem 1.25rem;
}

.kc-pro-hero-jason {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	padding-bottom: 0.85rem;
	margin-bottom: 0.85rem;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.kc-pro-hero-jason img {
	width: 56px !important;
	height: 56px !important;
	max-width: 56px !important;
	border-radius: 50%;
	object-fit: cover;
	object-position: 50% 20%;
	flex-shrink: 0;
	background: #1a2a3d;
}

.kc-pro-hero-jason-name {
	font-size: 1.0625rem;
	font-weight: 700;
	color: #fff;
	margin-bottom: 0.25rem;
}

.kc-pro-hero-jason p {
	font-size: 0.8125rem;
	line-height: 1.4;
	color: rgba(255, 255, 255, 0.7);
	margin: 0;
}

.kc-pro-stats {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.9rem 1rem;
}

.kc-pro-stat-num {
	font-size: 1.85rem;
	font-weight: 700;
	line-height: 1;
	color: var(--kc-sky);
	font-variant-numeric: tabular-nums;
}

.kc-pro-stat-label {
	font-size: 0.8125rem;
	color: rgba(255, 255, 255, 0.72);
	margin-top: 0.2rem;
}

.kc-pro-band {
	padding: 6.5rem var(--kc-pro-pad) 6.5rem;
	background: var(--kc-paper);
}

.kc-pro-band-paper {
	background: #fff;
	border-top: 1px solid var(--kc-line);
	border-bottom: 1px solid var(--kc-line);
}

.kc-pro-band-dark {
	background-color: var(--kc-navy);
	color: #fff;
	background-image: linear-gradient(rgba(120, 180, 230, 0.07) 1px, transparent 1px), linear-gradient(90deg, rgba(120, 180, 230, 0.07) 1px, transparent 1px);
	background-size: 48px 48px;
	border: 0;
}

.kc-pro-band-tight {
	padding-top: 2rem;
	padding-bottom: 7rem;
}

.kc-pro-band > .kc-heading-block > .kc-pro-kicker {
	margin: 0 0 0.75rem;
}

.kc-pro-band > .kc-heading-block {
	max-width: var(--kc-pro-max);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.5rem 6rem;
}

.kc-pro-home .kc-pro-band .kc-heading {
	margin-bottom: 0;
}

.kc-pro-home .kc-pro-band .kc-heading-lead {
	font-size: clamp(1.85rem, 3.2vw, 2.5rem);
	line-height: 1.1;
	letter-spacing: -0.01em;
	color: var(--kc-ink);
}

.kc-pro-home .kc-pro-band .kc-heading-title {
	font-size: 1.125rem;
	font-weight: 500;
	line-height: 1.45;
	color: var(--kc-label);
	max-width: 47.5rem;
}

.kc-pro-home .kc-pro-band-dark .kc-heading-lead,
.kc-pro-home .kc-heading-dark .kc-heading-lead {
	color: #fff;
}

.kc-pro-home .kc-pro-band-dark .kc-heading-title,
.kc-pro-home .kc-heading-dark .kc-heading-title {
	color: rgba(255, 255, 255, 0.78);
}

.kc-pro-copy p,
.kc-pro-cycle-intro,
.kc-pro-team-line,
.kc-pro-tint p,
.kc-pro-dash p,
.kc-pro-rules-3 p,
.kc-pro-rules-2 p {
	font-size: 1.125rem;
	line-height: 1.65;
	color: var(--kc-muted);
	margin: 0 0 1.15rem;
}

.kc-pro-copy p:last-child {
	margin-bottom: 0;
}

.kc-pro-copy .kc-pro-textlink {
	margin-top: 0.35rem;
}

.kc-pro-band-dark .kc-pro-copy p {
	color: rgba(255, 255, 255, 0.82);
}

.kc-pro-table {
	background: #fff;
	border: 1px solid var(--kc-line);
	border-radius: 12px;
	overflow: hidden;
	margin-top: 0.5rem;
}

.kc-pro-table-row {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.5rem 1.75rem;
	padding: 1.35rem 1.75rem;
	border-bottom: 1px solid var(--kc-line);
}

.kc-pro-table-row:last-child {
	border-bottom: 0;
}

.kc-pro-table-title {
	font-size: 1.125rem;
	font-weight: 700;
	color: var(--kc-ink);
}

.kc-pro-table-row p {
	font-size: 1rem;
	line-height: 1.6;
	color: var(--kc-muted);
	margin: 0;
}

.kc-pro-home .kc-home-cycle {
	display: block;
	position: relative;
	margin: 0.5rem 0 1.25rem;
}

.kc-pro-home .kc-home-cycle::before {
	display: none;
}

.kc-home-cycle-svg {
	display: block;
	width: 100%;
	height: auto;
}

.kc-pro-legend {
	display: flex;
	flex-wrap: wrap;
	gap: 1.75rem;
	font-size: 0.875rem;
	color: var(--kc-label);
}

.kc-pro-legend span {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

.kc-pro-swatch {
	display: inline-block;
	width: 12px;
	height: 12px;
	border-radius: 3px;
}

.kc-pro-swatch-pro {
	background: #E4F0F8;
	border: 1.5px solid var(--kc-blue);
}

.kc-pro-swatch-team {
	background: #FBF1DC;
	border: 1.5px solid var(--kc-gold-line);
}

.kc-pro-cards-3,
.kc-pro-cards-2,
.kc-pro-rules-3,
.kc-pro-rules-2,
.kc-pro-tools {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.25rem;
	margin-bottom: 2rem;
}

.kc-pro-tint,
.kc-pro-dash {
	background: var(--kc-paper);
	border-radius: 10px;
	padding: 1.6rem 1.75rem;
}

.kc-pro-tint-white {
	background: #fff;
}

.kc-pro-tint-team {
	background: #FBF1DC;
}

.kc-pro-dash {
	background: transparent;
	border: 1px dashed #B9C6D6;
}

.kc-pro-engine-logos {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
	margin: 0 0 0.85rem;
}

.kc-pro-engine-logos img {
	width: 24px;
	height: 24px;
	object-fit: contain;
	border-radius: 4px;
	background: #fff;
}

.kc-pro-tint ul {
	margin: 0 0 1.15rem;
	padding-left: 1.25rem;
	font-size: 1.125rem;
	line-height: 1.65;
	color: var(--kc-muted);
}

.kc-pro-tint li + li {
	margin-top: 0.35rem;
}

.kc-pro-tint > :last-child {
	margin-bottom: 0;
}

.kc-pro-rule-title {
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--kc-ink);
	margin-bottom: 0.5rem;
}

.kc-pro-rules-3 > div,
.kc-pro-rules-2 > div {
	border-top: 2px solid var(--kc-ink);
	padding-top: 1.1rem;
}

.kc-pro-rules-team > div {
	border-top-color: var(--kc-gold-line);
}

.kc-pro-home .kc-home-venn {
	display: block;
	width: 100%;
	max-width: 28.75rem;
	height: auto;
	margin: 0.5rem auto 1.5rem;
}

.kc-pro-fidelity {
	display: flex;
	flex-direction: column;
	gap: 1.75rem;
	background: var(--kc-navy);
	color: #fff;
	border-radius: 12px;
	padding: 2rem 2.25rem;
}

.kc-pro-fidelity-title {
	font-size: 1.375rem;
	font-weight: 700;
	margin-bottom: 0.5rem;
}

.kc-pro-fidelity p {
	color: rgba(255, 255, 255, 0.78);
	margin: 0;
}

.kc-pro-fidelity-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.625rem;
}

.kc-pro-fidelity-grid > div {
	border: 1px solid rgba(255, 255, 255, 0.16);
	border-radius: 8px;
	padding: 0.85rem 1rem;
	font-size: 0.8125rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--kc-sky);
	font-weight: 500;
}

.kc-pro-fidelity-grid > .is-overall {
	background: var(--kc-sky);
	border-color: var(--kc-sky);
	color: var(--kc-navy);
}

.kc-pro-band-center > .kc-heading-block {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.kc-pro-band-center .kc-heading-lead {
	max-width: 65rem;
}

.kc-pro-cmo,
.kc-pro-agency {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	background: #FBF1DC;
	border: 1px solid #F0DDB3;
	border-radius: 12px;
	padding: 2.25rem 2.5rem;
	margin-top: 0.5rem;
}

.kc-pro-agency {
	max-width: var(--kc-pro-max);
	margin: 0 auto;
	background: #fff;
	border-color: var(--kc-line);
}

.kc-pro-cmo-title {
	font-size: 1.625rem;
	font-weight: 700;
	letter-spacing: -0.01em;
	margin-bottom: 0.4rem;
}

.kc-pro-cmo p,
.kc-pro-agency p {
	font-size: 1.0625rem;
	line-height: 1.6;
	color: var(--kc-muted);
	margin: 0;
}

.kc-pro-tool,
.kc-pro-tool:hover {
	font-family: 'Google Sans Code', Menlo, monospace;
	background: #fff;
	border: 1px solid var(--kc-line);
	border-radius: 10px;
	padding: 1.35rem 1.5rem;
	font-size: 1rem;
	font-weight: 500;
	color: var(--kc-ink);
	display: flex;
	flex-direction: row-reverse;
	justify-content: space-between;
	align-items: center;
	gap: 0.75rem;
}

.kc-pro-tool .bi {
	color: var(--kc-blue);
}

.kc-pro-mueller {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2rem;
}

.kc-pro-mueller-photo {
	width: 140px;
	height: 140px;
	border-radius: 50%;
	object-fit: cover;
	flex-shrink: 0;
}

.kc-pro-home .kc-home-mueller .kc-testimonial--expert blockquote,
.kc-pro-home .kc-home-mueller .kc-testimonial-quote {
	font-family: 'Source Serif 4', Georgia, serif;
	font-size: clamp(1.5rem, 3vw, 2.25rem);
	line-height: 1.24;
	font-style: italic;
	font-weight: 400;
	color: var(--kc-ink);
}

.kc-pro-agency.kc-pro-plus {
	background: #FBF1DC;
	border-color: #F0DDB3;
}

.kc-pro-press {
	position: sticky;
	bottom: 0;
	z-index: 30;
	background: #fff;
	padding: 1.75rem clamp(1.25rem, 6vw, 7.5rem);
	display: flex;
	align-items: center;
	gap: 3.5rem;
	border-top: 1.5px solid var(--kc-sky);
	border-bottom: 1.5px solid var(--kc-sky);
	box-shadow: 0 -6px 18px rgba(26, 39, 78, 0.12);
}

.kc-pro-press-label {
	font-size: 0.875rem;
	font-weight: 700;
	color: #1A274E;
	white-space: nowrap;
}

.kc-pro-press-logos {
	flex: 1;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1.25rem;
	flex-wrap: wrap;
}

.kc-pro-press-logos img {
	height: 32px;
	width: auto;
	max-width: 11rem;
	object-fit: contain;
	filter: grayscale(1);
	mix-blend-mode: multiply;
	opacity: 0.7;
}

.kc-pro-press-logos .kc-pro-press-logo-lg {
	height: 48px;
	max-width: 16rem;
}

.kc-pro-quote-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.5rem;
}

.kc-pro-quote {
	background: #fff;
	border-radius: 14px;
	padding: 2.25rem 2.5rem;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 1.6rem;
	box-shadow: 0 4px 14px rgba(26, 39, 78, 0.08), 0 1px 3px rgba(26, 39, 78, 0.06);
}

.kc-pro-quote-body {
	display: flex;
	flex-direction: column;
	gap: 0.875rem;
}

.kc-pro-quote-kicker {
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: #2F7DB0;
}

.kc-pro-quote-metrics {
	display: flex;
	gap: 2.5rem;
	padding: 0.25rem 0 0.375rem;
}

.kc-pro-quote-metric-num {
	font-size: 2.75rem;
	font-weight: 700;
	line-height: 1;
	color: var(--kc-ink);
	font-variant-numeric: tabular-nums;
}

.kc-pro-quote-metric-label {
	font-size: 0.875rem;
	color: var(--kc-muted);
	margin-top: 0.25rem;
}

.kc-pro-quote-text {
	font-family: 'Source Serif 4', Georgia, serif;
	font-size: clamp(1.25rem, 2vw, 1.75rem);
	line-height: 1.28;
	font-style: italic;
	font-weight: 400;
	color: var(--kc-ink);
	margin: 0;
}

.kc-pro-quote-who {
	display: flex;
	align-items: center;
	gap: 1rem;
	border-top: 2px solid var(--kc-sky);
	padding-top: 1.125rem;
}

.kc-pro-quote-who img {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	object-fit: cover;
	flex-shrink: 0;
}

.kc-pro-quote-name {
	font-size: 1.0625rem;
	font-weight: 700;
	color: var(--kc-ink);
}

.kc-pro-quote-role {
	font-size: 0.9375rem;
	line-height: 1.4;
	color: var(--kc-muted);
}

.kc-pro-people {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.5rem 1rem;
	margin: 0.5rem 0 0;
}

.kc-pro-person {
	text-align: center;
}

.kc-pro-person img {
	width: 8.5rem;
	height: 8.5rem;
	border-radius: 50%;
	object-fit: cover;
	display: block;
	margin: 0 auto 0.75rem;
	background: var(--kc-paper);
}

.kc-pro-person-name {
	font-size: 1.0625rem;
	font-weight: 700;
	color: var(--kc-ink);
}

.kc-pro-person-role {
	font-size: 0.875rem;
	line-height: 1.4;
	color: var(--kc-muted);
	margin-top: 0.15rem;
}