/**
 * MNK Solin 1980 UI Foundation — WP1
 * Version: 1.0.0
 *
 * This file exposes design tokens and safe foundation utilities.
 * It does not restyle legacy Splash/WPBakery components.
 */

:root {
	--mnk-color-navy-950: #061426;
	--mnk-color-navy-900: #0a2342;
	--mnk-color-navy-800: #0d315a;
	--mnk-color-blue-700: #0c4a7e;
	--mnk-color-blue-600: #1166a8;
	--mnk-color-blue-500: #1682c4;
	--mnk-color-sky-200: #bfe8fa;
	--mnk-color-yellow-600: #e9b600;
	--mnk-color-yellow-500: #ffcb05;
	--mnk-color-yellow-300: #ffe37a;
	--mnk-color-yellow-100: #fff6cc;

	--mnk-color-white: #ffffff;
	--mnk-color-neutral-50: #f7f9fc;
	--mnk-color-neutral-100: #eef2f7;
	--mnk-color-neutral-200: #dce4ee;
	--mnk-color-neutral-300: #c4cfdd;
	--mnk-color-neutral-500: #64748b;
	--mnk-color-neutral-600: #475569;
	--mnk-color-neutral-700: #334155;
	--mnk-color-neutral-800: #1e293b;
	--mnk-color-neutral-900: #0f172a;

	--mnk-color-success-700: #207a44;
	--mnk-color-success-100: #dcf7e7;
	--mnk-color-warning-700: #8a5a00;
	--mnk-color-warning-100: #fff1c2;
	--mnk-color-error-700: #c62828;
	--mnk-color-error-100: #fde2e2;
	--mnk-color-info-700: #155e75;
	--mnk-color-info-100: #d9f3fa;

	--mnk-canvas: var(--mnk-color-white);
	--mnk-surface: var(--mnk-color-neutral-50);
	--mnk-surface-strong: var(--mnk-color-navy-900);
	--mnk-text: var(--mnk-color-neutral-900);
	--mnk-text-muted: var(--mnk-color-neutral-600);
	--mnk-text-inverse: var(--mnk-color-white);
	--mnk-border: var(--mnk-color-neutral-200);
	--mnk-action: var(--mnk-color-yellow-500);
	--mnk-action-text: var(--mnk-color-navy-950);
	--mnk-link: var(--mnk-color-blue-700);

	--mnk-font-display: "Barlow Condensed", "Arial Narrow", "Roboto Condensed", sans-serif;
	--mnk-font-body: "Inter", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--mnk-font-mono: "Roboto Mono", "SFMono-Regular", Consolas, monospace;

	--mnk-text-xs: 0.75rem;
	--mnk-text-sm: 0.875rem;
	--mnk-text-md: 1rem;
	--mnk-text-lg: 1.125rem;
	--mnk-text-xl: 1.25rem;
	--mnk-text-2xl: clamp(1.5rem, 1.2rem + 1vw, 2rem);
	--mnk-text-3xl: clamp(2rem, 1.45rem + 2vw, 3rem);
	--mnk-text-4xl: clamp(2.5rem, 1.5rem + 4vw, 4.75rem);
	--mnk-text-5xl: clamp(3.25rem, 1.8rem + 6vw, 6.5rem);

	--mnk-leading-tight: 1;
	--mnk-leading-display: 1.05;
	--mnk-leading-heading: 1.15;
	--mnk-leading-body: 1.6;
	--mnk-leading-compact: 1.35;

	--mnk-space-0: 0;
	--mnk-space-1: 0.25rem;
	--mnk-space-2: 0.5rem;
	--mnk-space-3: 0.75rem;
	--mnk-space-4: 1rem;
	--mnk-space-5: 1.25rem;
	--mnk-space-6: 1.5rem;
	--mnk-space-8: 2rem;
	--mnk-space-10: 2.5rem;
	--mnk-space-12: 3rem;
	--mnk-space-16: 4rem;
	--mnk-space-20: 5rem;
	--mnk-space-24: 6rem;
	--mnk-space-32: 8rem;

	--mnk-content-width: 76rem;
	--mnk-reading-width: 47.5rem;
	--mnk-wide-width: 90rem;
	--mnk-gutter: 1rem;
	--mnk-header-height: 4rem;

	--mnk-radius-sm: 0.25rem;
	--mnk-radius-md: 0.5rem;
	--mnk-radius-lg: 0.75rem;
	--mnk-radius-xl: 1rem;
	--mnk-radius-pill: 999px;

	--mnk-shadow-sm: 0 1px 2px rgb(6 20 38 / 0.08);
	--mnk-shadow-md: 0 8px 24px rgb(6 20 38 / 0.12);
	--mnk-shadow-lg: 0 18px 50px rgb(6 20 38 / 0.18);
	--mnk-shadow-inset: inset 0 0 0 1px rgb(6 20 38 / 0.1);

	--mnk-duration-fast: 120ms;
	--mnk-duration-base: 180ms;
	--mnk-duration-slow: 280ms;
	--mnk-duration-emphasis: 420ms;
	--mnk-ease-standard: cubic-bezier(0.2, 0, 0, 1);
	--mnk-ease-enter: cubic-bezier(0, 0, 0, 1);
	--mnk-ease-exit: cubic-bezier(0.3, 0, 1, 1);

	--mnk-z-raised: 10;
	--mnk-z-sticky: 100;
	--mnk-z-drawer: 300;
	--mnk-z-modal: 500;
	--mnk-z-toast: 700;

	--mnk-target-min: 2.75rem;
	--mnk-focus-width: 0.1875rem;
	--mnk-focus-offset: 0.1875rem;
	--mnk-scroll-padding: 6rem;
}

@media (min-width: 48rem) {
	:root {
		--mnk-gutter: 1.5rem;
		--mnk-header-height: 5rem;
	}
}

@media (min-width: 80rem) {
	:root {
		--mnk-gutter: 2rem;
	}
}

/* Safe utilities. Apply explicitly; no legacy selectors are overridden. */
.mnk-ui-scope {
	color: var(--mnk-text);
	font-family: var(--mnk-font-body);
	line-height: var(--mnk-leading-body);
}

.mnk-shell {
	width: min(100% - (2 * var(--mnk-gutter)), var(--mnk-content-width));
	margin-inline: auto;
}

.mnk-reading {
	width: min(100%, var(--mnk-reading-width));
}

.mnk-stack {
	display: flex;
	flex-direction: column;
	gap: var(--mnk-stack-gap, var(--mnk-space-6));
}

.mnk-cluster {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--mnk-cluster-gap, var(--mnk-space-4));
}

.mnk-grid {
	display: grid;
	grid-template-columns: repeat(
		auto-fit,
		minmax(min(100%, var(--mnk-grid-min, 16rem)), 1fr)
	);
	gap: var(--mnk-grid-gap, var(--mnk-space-6));
}

.mnk-section {
	padding-block: clamp(var(--mnk-space-12), 7vw, var(--mnk-space-24));
}

.mnk-eyebrow {
	margin: 0;
	color: var(--mnk-color-blue-700);
	font-size: var(--mnk-text-sm);
	font-weight: 700;
	letter-spacing: 0.09em;
	line-height: var(--mnk-leading-compact);
	text-transform: uppercase;
}

.mnk-display {
	margin: 0;
	font-family: var(--mnk-font-display);
	font-size: var(--mnk-text-5xl);
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: var(--mnk-leading-display);
	text-transform: uppercase;
}

.mnk-heading {
	margin: 0;
	font-family: var(--mnk-font-display);
	font-size: var(--mnk-text-3xl);
	font-weight: 700;
	line-height: var(--mnk-leading-heading);
}

.mnk-button {
	display: inline-flex;
	min-height: var(--mnk-target-min);
	align-items: center;
	justify-content: center;
	gap: var(--mnk-space-2);
	padding: 0.6875rem 1rem;
	border: 2px solid transparent;
	border-radius: var(--mnk-radius-md);
	background: var(--mnk-action);
	color: var(--mnk-action-text);
	font: 700 var(--mnk-text-md) / 1 var(--mnk-font-body);
	text-align: center;
	text-decoration: none;
	transition:
		transform var(--mnk-duration-fast) var(--mnk-ease-standard),
		background-color var(--mnk-duration-base) var(--mnk-ease-standard),
		color var(--mnk-duration-base) var(--mnk-ease-standard);
}

.mnk-button:hover {
	background: var(--mnk-color-yellow-300);
	transform: translateY(-1px);
}

.mnk-button--secondary {
	border-color: var(--mnk-color-navy-900);
	background: transparent;
	color: var(--mnk-color-navy-900);
}

.mnk-button--secondary:hover {
	background: var(--mnk-color-navy-900);
	color: var(--mnk-text-inverse);
}

.mnk-card {
	padding: var(--mnk-space-6);
	border: 1px solid var(--mnk-border);
	border-radius: var(--mnk-radius-lg);
	background: var(--mnk-canvas);
	box-shadow: var(--mnk-shadow-sm);
}

.mnk-ui-scope :where(a, button, input, select, textarea, summary):focus-visible {
	outline: var(--mnk-focus-width) solid var(--mnk-color-navy-950);
	outline-offset: var(--mnk-focus-offset);
	box-shadow: 0 0 0 0.125rem var(--mnk-color-white);
}

html:has(.mnk-ui-scope) {
	scroll-padding-top: var(--mnk-scroll-padding);
}

@media (prefers-reduced-motion: reduce) {
	.mnk-ui-scope *,
	.mnk-ui-scope *::before,
	.mnk-ui-scope *::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}
}