/*
 * CoffieHaus design tokens.
 *
 * Colors below were sampled by eye from the real, existing brand marks
 * (Consultancy crest, Media wordmark, The Coffie Farm logo) already in the
 * media library — not invented. Treat the hex values as close
 * approximations; if vector/brand-guide source files exist with exact
 * values, swap them in here rather than re-deriving from the PNGs.
 *
 * One institutional base (navy/charcoal/white — shared by the
 * Consultancy and Media marks) with three sub-brand accent overlays.
 * Farm is close to a fully independent palette, since its existing
 * logo never uses the navy family at all.
 */

:root {
	/* Institutional base — CoffieHaus Limited */
	--chg-navy: #16243f;
	--chg-navy-deep: #0e1728;
	--chg-charcoal: #1c1c1e;
	--chg-white: #ffffff;
	--chg-paper: #f7f6f3;
	--chg-ink: #1a1a1a;
	--chg-muted: #6b7280;
	--chg-border: #e2e0da;

	/* Type scale */
	--chg-font-display: "halyard-display", sans-serif; /* already loaded by the Quantum theme */
	--chg-font-body: inherit;
	--chg-size-h1: clamp(2.25rem, 4vw + 1rem, 4rem);
	--chg-size-h2: clamp(1.75rem, 2.5vw + 1rem, 2.75rem);
	--chg-size-h3: clamp(1.25rem, 1.5vw + 1rem, 1.75rem);
	--chg-size-body: 1rem;
	--chg-line-tight: 1.15;
	--chg-line-body: 1.6;

	/* Spacing scale */
	--chg-space-xs: 0.5rem;
	--chg-space-sm: 1rem;
	--chg-space-md: 1.5rem;
	--chg-space-lg: 2.5rem;
	--chg-space-xl: 4rem;
	--chg-space-2xl: 6rem;

	/* Shape */
	--chg-radius-card: 10px;
	--chg-radius-button: 6px;
	--chg-shadow-card: 0 1px 2px rgba(20, 20, 20, 0.06), 0 8px 24px rgba(20, 20, 20, 0.06);

	/* Default (institutional) accent — used when no sub-brand token applies */
	--chg-accent: var(--chg-navy);
	--chg-accent-contrast: var(--chg-white);
}

/* --- Consultancy: Technology / Intelligence — navy + steel blue/silver, from the crest mark --- */
[data-chg-brand="consultancy"] {
	--chg-accent: #3e6491;
	--chg-accent-deep: #16243f;
	--chg-accent-soft: #b9c2cc;
	--chg-accent-contrast: var(--chg-white);
}

/* --- Farm: Organic / Modern / Sustainable — green, from the The Coffie Farm logo (independent of the navy family) --- */
[data-chg-brand="farm"] {
	--chg-accent: #5fa828;
	--chg-accent-deep: #3f7d1f;
	--chg-accent-soft: #dcefc8;
	--chg-accent-contrast: var(--chg-white);
}

/* --- Media: Editorial / Cultural / Energetic — navy + gold, from the film-strip/mic wordmark --- */
[data-chg-brand="media"] {
	--chg-accent: #c9a24b;
	--chg-accent-deep: #16243f;
	--chg-accent-soft: #ecdfba;
	--chg-accent-contrast: var(--chg-ink);
}

/* --- Status badges: chg_project_stage taxonomy terms (Prototype -> Supported) --- */
.chg-badge {
	display: inline-block;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	padding: 0.3em 0.75em;
	border-radius: 999px;
	line-height: 1.4;
}
.chg-badge--prototype { background: #eef1f5; color: #47536b; }
.chg-badge--pilot { background: #fdf0d8; color: #8a5d16; }
.chg-badge--validated { background: #e2f0d9; color: #3f7d1f; }
.chg-badge--production { background: var(--chg-navy); color: var(--chg-white); }
.chg-badge--supported { background: var(--chg-charcoal); color: var(--chg-white); }

/* --- Shared card component, used by Project/Solution/Business archive grids --- */
.chg-card {
	display: flex;
	flex-direction: column;
	gap: var(--chg-space-xs);
	padding: var(--chg-space-md);
	background: var(--chg-white);
	border: 1px solid var(--chg-border);
	border-radius: var(--chg-radius-card);
	box-shadow: var(--chg-shadow-card);
	border-top: 3px solid var(--chg-accent);
	height: 100%;
}
.chg-card__eyebrow {
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--chg-accent);
}
.chg-card__title {
	font-family: var(--chg-font-display);
	font-size: var(--chg-size-h3);
	line-height: var(--chg-line-tight);
	margin: 0;
	color: var(--chg-ink);
}
.chg-card__excerpt {
	color: var(--chg-muted);
	line-height: var(--chg-line-body);
}
.chg-card__meta {
	display: flex;
	gap: var(--chg-space-xs);
	flex-wrap: wrap;
	margin-top: auto;
	padding-top: var(--chg-space-xs);
}

.chg-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: var(--chg-space-lg);
	margin: var(--chg-space-xl) 0;
}

.chg-cta {
	display: inline-block;
	padding: 0.85em 1.75em;
	background: var(--chg-accent);
	color: var(--chg-accent-contrast);
	border-radius: var(--chg-radius-button);
	font-weight: 600;
	text-decoration: none;
	transition: opacity 0.15s ease;
}
.chg-cta:hover { opacity: 0.85; color: var(--chg-accent-contrast); }

/* Reduced motion — brief's accessibility principle */
@media (prefers-reduced-motion: reduce) {
	.chg-cta, .chg-card { transition: none; }
}