/* ==========================================================================
   Moschovakis Capital — Design System
   Tokens + primitives + components. Loaded first, everywhere.
   ========================================================================== */

/* ---------- Tokens ---------- */
:root {
	/* Palette */
	--mc-onyx:        #0a0a0a;
	--mc-onyx-2:      #111113;
	--mc-onyx-3:      #1a1a1d;
	--mc-navy:        #1a1a2e;
	--mc-gold:        #D4AF37;
	--mc-gold-soft:   #b8952e;
	--mc-gold-glow:   rgba(212, 175, 55, 0.18);
	--mc-ivory:       #f5f1e8;
	--mc-paper:       #fafaf7;
	--mc-paper-2:     #f3f0e8;
	--mc-ink:         #1a1a1a;
	--mc-ink-2:       #2a2a2a;
	--mc-mute:        #6b6b6b;
	--mc-mute-2:      #8a8a8a;
	--mc-line:        #e3e0d6;
	--mc-line-2:      #d6d2c4;
	--mc-success:     #2f7d4f;
	--mc-danger:      #b8352d;

	/* Type scale (fluid) */
	--mc-fs-xs:   clamp(0.75rem, 0.72rem + 0.15vw, 0.8125rem);
	--mc-fs-sm:   clamp(0.875rem, 0.83rem + 0.2vw, 0.9375rem);
	--mc-fs-base: clamp(1rem, 0.95rem + 0.25vw, 1.0625rem);
	--mc-fs-lg:   clamp(1.125rem, 1.05rem + 0.4vw, 1.25rem);
	--mc-fs-xl:   clamp(1.375rem, 1.25rem + 0.6vw, 1.625rem);
	--mc-fs-2xl:  clamp(1.75rem, 1.55rem + 1vw, 2.25rem);
	--mc-fs-3xl:  clamp(2.25rem, 1.9rem + 1.7vw, 3rem);
	--mc-fs-4xl:  clamp(2.75rem, 2.2rem + 2.5vw, 4rem);
	--mc-fs-hero: clamp(3rem, 2rem + 5vw, 6rem);

	/* Type faces */
	--mc-ff-serif: 'Cinzel', 'Playfair Display', Georgia, serif;
	--mc-ff-sans:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
	--mc-ff-mono:  ui-monospace, 'JetBrains Mono', 'Fira Code', Consolas, monospace;

	/* Line heights */
	--mc-lh-tight: 1.15;
	--mc-lh-snug:  1.35;
	--mc-lh-body:  1.65;
	--mc-lh-loose: 1.8;

	/* Spacing */
	--mc-sp-0:  0;
	--mc-sp-1:  0.25rem;
	--mc-sp-2:  0.5rem;
	--mc-sp-3:  0.75rem;
	--mc-sp-4:  1rem;
	--mc-sp-5:  1.5rem;
	--mc-sp-6:  2rem;
	--mc-sp-7:  2.5rem;
	--mc-sp-8:  3rem;
	--mc-sp-10: 4rem;
	--mc-sp-12: 5rem;
	--mc-sp-16: 7rem;
	--mc-sp-20: 9rem;
	--mc-section: clamp(3.5rem, 2rem + 4vw, 6.5rem);

	/* Radii */
	--mc-radius-sm: 2px;
	--mc-radius:    4px;
	--mc-radius-lg: 8px;

	/* Shadows */
	--mc-shadow-sm: 0 1px 2px rgba(10,10,10,0.05);
	--mc-shadow:    0 6px 24px rgba(10,10,10,0.08);
	--mc-shadow-lg: 0 20px 48px rgba(10,10,10,0.12);

	/* Motion */
	--mc-ease:      cubic-bezier(0.16, 1, 0.3, 1);
	--mc-dur-fast:  150ms;
	--mc-dur:       260ms;
	--mc-dur-slow:  480ms;

	/* Layout widths */
	--mc-w-narrow: 720px;
	--mc-w-read:   840px;
	--mc-w-wide:   1200px;
	--mc-w-full:   1400px;
	--mc-gutter:   clamp(1rem, 0.5rem + 2vw, 2rem);
}

/* ---------- Reset / base ---------- */
*, *::before, *::after { box-sizing: border-box; }
/* Cover any gap above the sticky header */
html::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 60px;
	background: var(--mc-onyx);
	z-index: 39;
	pointer-events: none;
}
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; background: var(--mc-onyx); }
body {
	margin: 0;
	overflow-x: hidden;
	font-family: var(--mc-ff-sans);
	font-size: var(--mc-fs-base);
	line-height: var(--mc-lh-body);
	color: var(--mc-ink);
	background: var(--mc-paper);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
img, picture, video, canvas, svg { display: block; max-width: 100%; height: auto; }
input, button, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; }
a { color: var(--mc-gold-soft); text-decoration: none; border-bottom: 1px solid currentColor; transition: color var(--mc-dur-fast) var(--mc-ease); }
a:hover { color: var(--mc-ink); }

/* ---------- Typography ---------- */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--mc-ff-serif);
	font-weight: 500;
	line-height: var(--mc-lh-tight);
	letter-spacing: -0.01em;
	margin: 0 0 var(--mc-sp-5);
	color: var(--mc-ink);
}
h1 { font-size: var(--mc-fs-4xl); }
h2 { font-size: var(--mc-fs-3xl); }
h3 { font-size: var(--mc-fs-2xl); }
h4 { font-size: var(--mc-fs-xl); }
h5 { font-size: var(--mc-fs-lg); }
h6 { font-size: var(--mc-fs-base); text-transform: uppercase; letter-spacing: 0.08em; }

p { margin: 0 0 var(--mc-sp-5); }
small { font-size: var(--mc-fs-sm); color: var(--mc-mute); }
strong { font-weight: 600; }
em { font-style: italic; }

.mc-eyebrow {
	font-family: var(--mc-ff-sans);
	font-size: var(--mc-fs-xs);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.18em;
	color: var(--mc-gold-soft);
	margin: 0 0 var(--mc-sp-3);
}
.mc-eyebrow a { color: inherit; border: 0; }

/* ---------- Buttons ---------- */
.mc-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--mc-sp-2);
	padding: 0.95rem 1.6rem;
	font-family: var(--mc-ff-sans);
	font-size: var(--mc-fs-sm);
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	border: 1px solid transparent;
	border-radius: var(--mc-radius);
	transition: transform var(--mc-dur-fast) var(--mc-ease),
	            background var(--mc-dur-fast) var(--mc-ease),
	            color var(--mc-dur-fast) var(--mc-ease),
	            border-color var(--mc-dur-fast) var(--mc-ease),
	            box-shadow var(--mc-dur) var(--mc-ease);
	cursor: pointer;
	text-decoration: none;
	line-height: 1;
}
.mc-btn:hover { transform: translateY(-1px); }
.mc-btn:active { transform: translateY(0); }
.mc-btn:focus-visible {
	outline: 2px solid var(--mc-gold);
	outline-offset: 3px;
}

.mc-btn--gold {
	background: var(--mc-gold);
	color: var(--mc-onyx);
	border-color: var(--mc-gold);
	box-shadow: 0 0 0 0 var(--mc-gold-glow);
}
.mc-btn--gold:hover {
	background: var(--mc-gold-soft);
	border-color: var(--mc-gold-soft);
	color: var(--mc-onyx);
	box-shadow: 0 10px 30px -10px var(--mc-gold-glow);
}

.mc-btn--ghost {
	background: transparent;
	color: var(--mc-ink);
	border-color: var(--mc-line-2);
}
.mc-btn--ghost:hover {
	border-color: var(--mc-ink);
	color: var(--mc-ink);
}

.mc-btn--dark {
	background: var(--mc-onyx);
	color: var(--mc-ivory);
	border-color: var(--mc-onyx);
}
.mc-btn--dark:hover { background: var(--mc-navy); border-color: var(--mc-navy); }

.mc-btn--sm  { padding: 0.65rem 1.1rem; font-size: var(--mc-fs-xs); }
.mc-btn--lg  { padding: 1.15rem 2rem;   font-size: var(--mc-fs-base); }
.mc-btn--block { display: flex; width: 100%; }

/* ---------- Forms ---------- */
input[type="text"], input[type="email"], input[type="search"], input[type="tel"],
input[type="url"], input[type="number"], textarea, select {
	width: 100%;
	padding: 0.85rem 1rem;
	font-family: var(--mc-ff-sans);
	font-size: var(--mc-fs-base);
	color: var(--mc-ink);
	background: #fff;
	border: 1px solid var(--mc-line-2);
	border-radius: var(--mc-radius);
	transition: border-color var(--mc-dur-fast) var(--mc-ease),
	            box-shadow var(--mc-dur-fast) var(--mc-ease);
}
input:focus-visible, textarea:focus-visible, select:focus-visible {
	outline: 0;
	border-color: var(--mc-gold-soft);
	box-shadow: 0 0 0 3px var(--mc-gold-glow);
}
label { display: inline-block; margin-bottom: var(--mc-sp-2); font-weight: 500; font-size: var(--mc-fs-sm); }

/* ---------- Utility primitives ---------- */
.mc-sr-only {
	position: absolute;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0,0,0,0);
	white-space: nowrap; border: 0;
}
.mc-skip {
	position: absolute; top: -40px; left: 0;
	background: var(--mc-onyx); color: var(--mc-gold);
	padding: 0.5rem 1rem; border-bottom: 0;
	z-index: 1000;
}
.mc-skip:focus { top: 0; }

/* ---------- Popup Maker: force viewport center ---------- */
.pum-container.pum-position-fixed {
	position: fixed !important;
	top: 50% !important;
	left: 50% !important;
	transform: translate(-50%, -50%) !important;
	margin-left: 0 !important;
}

/* ---------- Popup: mobile width ---------- */
@media (max-width: 600px) {
	.pum-container.pum-position-fixed {
		width: 88vw !important;
		max-width: 88vw !important;
		max-height: 75vh !important;
		overflow-y: auto !important;
	}
}