/* QDE 2026 — home page, editorial register
 * Sections-only CSS. The chrome and editorial primitives live in components.css.
 */

/* (Hero flipbook button row + metric grid styling moved to components.css so
 * they apply on every page that hosts a flipbook button or a metrics grid,
 * not just home. This file now hosts only home-specific section styling.) */

/* Vision + Mission grid moved to page-content.css (now used on the Company page). */

/* ─────────────────────────────────────────────────
 * POSITION — three editorial lines stacked
 * ───────────────────────────────────────────────── */

.qde-2026 .ed-position {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--qde-space-2);
}

.qde-2026 .ed-position li {
	font-family: var(--qde-font-headline);
	font-weight: var(--qde-weight-light);
	font-size: var(--qde-text-2xl);
	line-height: 1.05;
	letter-spacing: -0.015em;
	color: var(--qde-ink);
	max-width: 26ch;
}

.qde-2026 .ed-position .red {
	color: var(--qde-red);
	font-weight: var(--qde-weight-bold);
}

/* ─────────────────────────────────────────────────
 * PRODUCT CARDS — three chapters with status pills
 * ───────────────────────────────────────────────── */

.qde-2026 .ed-product {
	padding: var(--qde-space-6);
	display: flex;
	flex-direction: column;
}

.qde-2026 .ed-product__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: var(--qde-space-3);
	margin-bottom: var(--qde-space-6);
}

.qde-2026 .ed-product__eyebrow {
	font-size: var(--qde-text-xs);
	letter-spacing: var(--qde-tracking-wider);
	text-transform: lowercase;
	color: var(--ink-soft);
}

/* Override stat-tag's bottom margin when used inside product head */
.qde-2026 .ed-product__head .ed-stat-tag { margin-bottom: 0; }

.qde-2026 .ed-product__name {
	font-family: var(--qde-font-headline);
	/* Capped at 56px so each product name stays smaller than the home hero
	 * headline (80px). Also keeps the card heading proportional to the
	 * tagline + prose underneath it. */
	font-size: clamp(32px, 3.2vw, 56px);
	font-weight: var(--qde-weight-bold);
	line-height: 0.95;
	letter-spacing: -0.025em;
	color: var(--qde-ink);
	margin: 0 0 var(--qde-space-3);
}

.qde-2026 .ed-product__tagline {
	font-size: var(--qde-text-md);
	font-weight: var(--qde-weight-regular);
	line-height: 1.35;
	color: var(--qde-ink);
	margin: 0 0 var(--qde-space-3);
	max-width: 38ch;
}

.qde-2026 .ed-product__prose {
	font-size: var(--qde-text-base);
	line-height: 1.55;
	color: var(--ink-soft);
	margin: 0 0 var(--qde-space-6);
	flex: 1;
}

.qde-2026 .ed-product__link {
	font-size: var(--qde-text-sm);
	letter-spacing: var(--qde-tracking-wide);
	text-transform: lowercase;
	color: var(--qde-ink);
	text-decoration: none;
	border-top: 1px solid var(--rule);
	padding-top: var(--qde-space-3);
	margin-top: auto;
	transition: color var(--qde-dur-quick) var(--qde-ease-standard);
}

.qde-2026 .ed-product__link:hover { color: var(--qde-red); }

/* Four-pillars grid moved to components.css (shared by home + Compass). */

/* (METRICS rules moved to components.css.) */

/* ─────────────────────────────────────────────────
 * PRESENCE — bone panel with map + countries aside
 * ───────────────────────────────────────────────── */

.qde-2026 .ed-presence {
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: var(--qde-space-12);
	align-items: start;
}

.qde-2026 .ed-presence__map-wrap {
	border: 1px solid var(--rule);
	background: var(--paper);
}

.qde-2026 .ed-presence__map {
	display: block;
	width: 100%;
	height: auto;
}

.qde-2026 .ed-presence__line {
	font-family: var(--qde-font-headline);
	font-weight: var(--qde-weight-light);
	font-size: var(--qde-text-xl);
	line-height: 1.3;
	letter-spacing: -0.005em;
	color: var(--qde-ink);
	margin: 0;
	max-width: 22ch;
}

.qde-2026 .ed-presence__legend {
	list-style: none;
	margin: var(--qde-space-6) 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--qde-space-2);
	font-size: var(--qde-text-xs);
	letter-spacing: var(--qde-tracking-wider);
	text-transform: lowercase;
	color: var(--ink-soft);
}

.qde-2026 .ed-presence__legend li {
	display: inline-flex;
	align-items: center;
	gap: 0.6em;
}

.qde-2026 .ed-presence__dot {
	display: inline-block;
	width: 8px;
	height: 8px;
}

.qde-2026 .ed-presence__dot--red { background: var(--qde-red); }
.qde-2026 .ed-presence__dot--ink { background: var(--qde-ink); }

@media (max-width: 880px) {
	.qde-2026 .ed-presence { grid-template-columns: 1fr; }
}

/* ─────────────────────────────────────────────────
 * "Small company. Big impact." — anchor moment
 * ───────────────────────────────────────────────── */

.qde-2026 .ed-anchor__title {
	font-family: var(--qde-font-headline);
	font-weight: var(--qde-weight-bold);
	font-size: var(--qde-text-display);
	line-height: 0.9;
	letter-spacing: -0.025em;
	color: var(--qde-ink);
	margin: 0;
	max-width: 18ch;
}

.qde-2026 .ed-anchor__title .red { color: var(--qde-red); }

/* ─────────────────────────────────────────────────
 * PROGRAMS — five cells in a 1px-rule row
 * ───────────────────────────────────────────────── */

.qde-2026 .ed-program {
	padding: var(--qde-space-5) var(--qde-space-5);
	display: flex;
	flex-direction: column;
	gap: var(--qde-space-1);
}

.qde-2026 .ed-program__name {
	font-family: var(--qde-font-headline);
	font-size: var(--qde-text-md);
	font-weight: var(--qde-weight-bold);
	color: var(--qde-ink);
	letter-spacing: -0.005em;
	margin-top: var(--qde-space-1);
}

.qde-2026 .ed-program__tag {
	font-size: var(--qde-text-sm);
	color: var(--ink-soft);
	line-height: 1.45;
}