/**
 * PROVE Web Design System — global tokens and lightweight primitives.
 * Helvetica Now Display files are intentionally not bundled; licensed WOFF2
 * assets can be connected by the deployment environment when supplied.
 */
:root {
	--prove-flora: #97c83d;
	--prove-agua: #4b7bbe;
	--prove-sol: #e5ba26;
	--prove-terra: #eb6124;
	--prove-mineral: #35444e;
	--prove-white: #ffffff;
	--prove-bg: #ffffff;
	--prove-bg-soft: #f5f5f1;
	--prove-surface-muted: #f3f4f4;
	--prove-surface-dark: #46565f;
	--prove-border: #dfe1e3;
	--prove-text: #35444e;
	--prove-text-muted: rgba(53, 68, 78, 0.72);
	--prove-flora-soft: #f3f8e8;
	--prove-agua-soft: #edf2f8;
	--prove-sol-soft: #fcf7e5;
	--prove-terra-soft: #fdefe9;
	--prove-error: #a43f12;
	--prove-container: 1280px;
	--prove-gutter: clamp(20px, 4vw, 64px);
	--prove-section-y: clamp(72px, 8vw, 120px);
	--prove-section-y-lg: clamp(88px, 10vw, 144px);
	--prove-radius-sm: 8px;
	--prove-radius-md: 14px;
	--prove-radius-lg: 20px;
	--prove-radius-xl: 28px;
	--prove-media-radius: 34px;
	--prove-radius-pill: 999px;
	--prove-duration-fast: 160ms;
	--prove-duration-ui: 240ms;
	--prove-duration-reveal: 560ms;
	--prove-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--prove-space-1: 4px;
	--prove-space-2: 8px;
	--prove-space-3: 12px;
	--prove-space-4: 16px;
	--prove-space-5: 24px;
	--prove-space-6: 32px;
	--prove-space-7: 48px;
	--prove-space-8: 64px;
	--prove-space-9: 80px;
	--prove-space-10: 96px;
	--prove-space-11: 120px;
	--prove-space-12: 144px;
	--prove-font: "Helvetica Now Display", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; }
img, svg, video { display: block; max-width: 100%; }
a { color: inherit; }
button, input, textarea, select { font: inherit; }

.prove-container,
.prove-home-container {
	width: min(calc(100% - (2 * var(--prove-gutter))), var(--prove-container));
	margin-inline: auto;
}

.prove-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 24px; }
.prove-stack { display: flex; flex-direction: column; gap: var(--prove-space-5); }
.prove-section { padding-block: var(--prove-section-y); }
.prove-section--large { padding-block: var(--prove-section-y-lg); }

.prove-display,
.prove-h1,
.prove-h2,
.prove-h3,
.prove-h4 {
	margin: 0;
	font-family: var(--prove-font);
	text-wrap: balance;
	hyphens: none;
}
.prove-display { font-size: clamp(56px, 7vw, 104px); font-weight: 800; line-height: 0.92; letter-spacing: -0.05em; }
.prove-h1 { max-width: 18ch; font-size: clamp(44px, 6vw, 88px); font-weight: 800; line-height: 0.95; letter-spacing: -0.045em; }
.prove-h2 { max-width: 22ch; font-size: clamp(36px, 4.6vw, 64px); font-weight: 800; line-height: 0.98; letter-spacing: -0.04em; }
.prove-h3 { font-size: clamp(28px, 3vw, 40px); font-weight: 700; line-height: 1.05; letter-spacing: -0.03em; }
.prove-h4 { font-size: clamp(22px, 2vw, 28px); font-weight: 700; line-height: 1.15; }
.prove-text-large { max-width: 68ch; font-size: clamp(20px, 1.4vw, 24px); font-weight: 500; line-height: 1.45; text-wrap: pretty; }
.prove-body { max-width: 68ch; font-size: clamp(16px, calc(0.4vw + 15px), 18px); font-weight: 500; line-height: 1.6; text-wrap: pretty; }
.prove-small { font-size: 14px; font-weight: 500; line-height: 1.5; }
.prove-label { font-size: clamp(12px, 0.3vw + 11px, 13px); font-weight: 700; line-height: 1.2; letter-spacing: 0.08em; text-transform: uppercase; }

.prove-button {
	display: inline-flex;
	min-width: 44px;
	min-height: 48px;
	padding: 0 24px;
	align-items: center;
	justify-content: center;
	gap: 12px;
	border: 1px solid transparent;
	border-radius: var(--prove-radius-pill);
	font-size: 15px;
	font-weight: 700;
	line-height: 1;
	text-decoration: none;
	transition: transform var(--prove-duration-ui) var(--prove-ease), background-color var(--prove-duration-ui) ease, border-color var(--prove-duration-ui) ease, color var(--prove-duration-ui) ease;
}
.prove-button--hero { min-height: 52px; padding-inline: 26px; }
.prove-button--flora { background: var(--prove-flora); color: var(--prove-mineral); }
.prove-button--mineral { background: var(--prove-mineral); color: var(--prove-white); }
.prove-button--ghost { border-color: rgba(255,255,255,.68); background: transparent; color: var(--prove-white); }
.prove-button:hover { transform: translateY(-2px); }
.prove-button:focus-visible,
.prove-text-link:focus-visible,
.prove-site a:focus-visible,
.prove-site button:focus-visible,
.prove-map-state-group:focus-visible {
	outline: 3px solid var(--prove-mineral);
	outline-offset: 4px;
}
.prove-button--ghost:focus-visible,
.prove-global-header a:focus-visible,
.prove-global-header button:focus-visible,
.prove-global-footer a:focus-visible,
.prove-map-section a:focus-visible,
.prove-map-state-group:focus-visible { outline-color: var(--prove-flora); }

.prove-text-link {
	display: inline-flex;
	min-height: 44px;
	align-items: center;
	gap: 12px;
	border-bottom: 1px solid currentColor;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
}
.prove-text-link:hover { border-bottom-width: 2px; }
.prove-icon { width: 18px; height: 18px; flex: 0 0 auto; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

.prove-media-placeholder {
	display: grid;
	width: 100%;
	min-height: 280px;
	place-items: center;
	border: 0;
	border-radius: var(--prove-radius-lg);
	background: var(--prove-surface-muted);
	color: var(--prove-text-muted);
}
.prove-media-placeholder > span { font-size: 12px; font-weight: 700; letter-spacing: .1em; }
.prove-media-placeholder--portrait { aspect-ratio: 4 / 5; min-height: 0; }

.screen-reader-text,
.prove-screen-reader-text {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}
.screen-reader-text:focus,
.prove-screen-reader-text:focus {
	position: fixed !important;
	top: 12px !important;
	left: 12px !important;
	z-index: 10000;
	width: auto !important;
	height: auto !important;
	padding: 12px 16px !important;
	margin: 0 !important;
	clip: auto !important;
	background: var(--prove-white);
	color: var(--prove-mineral);
}

@media (max-width: 1199px) {
	.prove-grid { grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 20px; }
}
@media (max-width: 767px) {
	.prove-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
}

@media (max-width: 1024px) { :root { --prove-media-radius: 30px; } }
@media (max-width: 767px) { :root { --prove-media-radius: 24px; } }
