/* Michelle Mugo — executive portfolio (Bootstrap 4.6 base) */

:root {
	/* Neutrals — deep blue slate */
	--mm-ink: #081a32;
	--mm-charcoal: #102746;
	--mm-charcoal-soft: #1b3a62;
	--mm-muted: #4f6483;
	--mm-muted-light: #7f93af;

	/* Surfaces */
	--mm-white: #ffffff;
	--mm-cream: #eef4ff;
	--mm-paper: #f4f8ff;
	--mm-sand: #dfe9f8;
	--mm-surface-elevated: #eaf1fc;

	/* Brand — dark blue + fresh accent */
	--mm-primary: #1f5fb0;
	--mm-primary-deep: #133f7d;
	--mm-primary-soft: #3a7ccc;
	--mm-slate: #17345d;
	--mm-navy: #0e2647;
	--mm-forest: var(--mm-primary);
	--mm-accent: #a8c94a;
	--mm-accent-light: #d1eb68;
	--mm-accent-deep: #7e9f2f;
	--mm-gold: var(--mm-accent-deep);
	--mm-gold-bright: var(--mm-accent-light);

	/* Lines & glass */
	--mm-line: rgba(14, 33, 59, 0.1);
	--mm-line-strong: rgba(14, 33, 59, 0.16);
	--mm-glass-dark: rgba(7, 20, 38, 0.9);
	--mm-glass-light: rgba(255, 255, 255, 0.97);

	/* Hero atmosphere */
	--mm-hero-mid: rgba(18, 47, 91, 0.96);
	--mm-hero-edge: rgba(6, 17, 36, 0.98);
	--mm-hero-glow: rgba(209, 235, 104, 0.2);
	--mm-hero-floor: rgba(22, 71, 138, 0.48);

	/* Shadows (tinted to blue palette) */
	--mm-shadow: 0 24px 56px rgba(11, 33, 63, 0.16);
	--mm-shadow-sm: 0 10px 32px rgba(11, 33, 63, 0.11);
	--mm-shadow-glow: 0 0 0 1px rgba(157, 183, 79, 0.22), 0 28px 52px rgba(11, 33, 63, 0.2);

	--mm-font-body: "DM Sans", system-ui, -apple-system, sans-serif;
	--mm-font-display: "Cormorant Garamond", Georgia, serif;
	--mm-radius: 8px;
	--mm-radius-lg: 14px;
	--mm-nav-h: 60px;
	--mm-nav-offset: 60px;
	--mm-reveal-delay: 0ms;
	--mm-ease-out: cubic-bezier(0.22, 1, 0.36, 1);

	/* Photo treatment — grey wash on foreground images + section BG stacks */
	--mm-photo-overlay: linear-gradient(180deg, rgba(36, 50, 64, 0.28) 0%, rgba(36, 50, 64, 0.42) 100%);
	--mm-photo-overlay-soft: linear-gradient(160deg, rgba(36, 50, 64, 0.22) 0%, rgba(36, 50, 64, 0.36) 100%);
}

html {
	scroll-behavior: smooth;
}

body {
	color: var(--mm-muted);
	font-family: var(--mm-font-body);
	font-size: 1rem;
	line-height: 1.7;
	background:
		radial-gradient(ellipse 100% 70% at 50% -15%, rgba(26, 79, 148, 0.06), transparent 52%),
		radial-gradient(ellipse 80% 50% at 100% 0%, rgba(157, 183, 79, 0.05), transparent 45%),
		var(--mm-paper);
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.mm-heading,
.mm-h3,
.mm-display {
	font-family: var(--mm-font-display);
	color: var(--mm-charcoal);
	font-weight: 600;
}

a {
	color: var(--mm-forest);
	text-decoration: none;
	transition: color 0.2s ease, opacity 0.2s ease;
}

a:hover {
	color: var(--mm-primary-deep);
	text-decoration: none;
}

::selection {
	background: rgba(26, 79, 148, 0.22);
	color: var(--mm-ink);
}

/* ---------- Navigation ---------- */
.mm-navbar {
	background: var(--mm-glass-dark);
	backdrop-filter: blur(16px) saturate(140%);
	-webkit-backdrop-filter: blur(16px) saturate(140%);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	transition: background 0.35s ease, box-shadow 0.35s ease, padding 0.35s ease;
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.05);
	padding-top: env(safe-area-inset-top, 0px);
	z-index: 1030;
}

.mm-brand {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	line-height: 1.2;
	padding-top: 0.35rem;
	padding-bottom: 0.35rem;
}

.mm-brand-name {
	font-family: var(--mm-font-display);
	font-size: 1.35rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	text-transform: none;
	color: var(--mm-cream);
}

.mm-brand-tag {
	font-family: var(--mm-font-body);
	font-size: 0.65rem;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--mm-accent-light);
	opacity: 0.92;
}

.mm-nav-link {
	color: rgba(247, 244, 239, 0.85) !important;
	padding-top: 0.65rem !important;
	padding-bottom: 0.5rem !important;
	position: relative;
	border-bottom: 2px solid transparent;
}

.mm-nav-link:hover,
.mm-nav-link:focus {
	color: var(--mm-white) !important;
}

.mm-nav-link.active {
	color: var(--mm-white) !important;
	border-bottom-color: var(--mm-accent-light);
	text-shadow: 0 0 14px rgba(209, 235, 104, 0.45);
}

.mm-navbar.top-nav-collapse .mm-nav-link.active {
	color: var(--mm-charcoal) !important;
	border-bottom-color: var(--mm-primary);
}

.mm-navbar .navbar-toggler {
	border: none;
	padding: 0.35rem 0.5rem;
	min-width: 48px;
	min-height: 48px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--mm-radius);
}

.mm-navbar .navbar-toggler:focus {
	outline: none;
	box-shadow: 0 0 0 2px rgba(212, 188, 148, 0.45);
}

.mm-nav-backdrop {
	position: fixed;
	inset: 0;
	z-index: 1025;
	background: rgba(8, 12, 18, 0.52);
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
	-webkit-tap-highlight-color: transparent;
}

.mm-nav-backdrop.is-visible {
	opacity: 1;
	visibility: visible;
}

body.mm-nav-open {
	overflow: hidden;
	touch-action: none;
}

.offcanvas-collapse {
	position: fixed;
	top: var(--mm-nav-offset, 60px);
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	max-width: 100%;
	height: calc(100vh - var(--mm-nav-offset, 60px));
	max-height: calc(100vh - var(--mm-nav-offset, 60px));
	height: calc(100dvh - var(--mm-nav-offset, 60px));
	max-height: calc(100dvh - var(--mm-nav-offset, 60px));
	padding: 0 max(1rem, env(safe-area-inset-right)) calc(1.25rem + env(safe-area-inset-bottom, 0px)) max(1rem, env(safe-area-inset-left));
	overflow: hidden;
	visibility: hidden;
	transform: translateY(-12px);
	opacity: 0;
	background: linear-gradient(168deg, var(--mm-ink) 0%, var(--mm-slate) 52%, var(--mm-primary-deep) 100%);
	transition: transform 0.32s var(--mm-ease-out), opacity 0.28s ease, visibility 0.32s ease;
	display: flex;
	flex-direction: column;
	z-index: 1032;
	box-shadow: 0 24px 48px rgba(0, 0, 0, 0.35);
}

.offcanvas-collapse.open {
	visibility: visible;
	transform: translateY(0);
	opacity: 1;
}

.mm-nav-list {
	flex: 1 1 auto;
	overflow-y: auto;
	overflow-x: hidden;
	-webkit-overflow-scrolling: touch;
	margin-top: 0.25rem;
	margin-bottom: 0;
	padding-bottom: 0.5rem;
}

.mm-nav-mobile-cta {
	margin-top: auto;
	padding-top: 1rem;
	padding-bottom: calc(0.25rem + env(safe-area-inset-bottom, 0px));
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	flex-shrink: 0;
}

.mm-nav-connect-btn {
	padding-top: 0.95rem;
	padding-bottom: 0.95rem;
	font-size: 0.8125rem;
}

.mm-navbar .navbar-nav {
	margin-top: 0.5rem;
}

.mm-navbar .mm-btn-sm {
	font-size: 0.75rem;
	padding: 0.5rem 1.1rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.mm-navbar.top-nav-collapse {
	background: var(--mm-glass-light) !important;
	backdrop-filter: blur(18px) saturate(160%);
	-webkit-backdrop-filter: blur(18px) saturate(160%);
	box-shadow: 0 1px 0 var(--mm-line), 0 12px 40px rgba(22, 40, 48, 0.06);
}

@media (min-width: 992px) {
	:root {
		--mm-nav-h: 72px;
	}

	.mm-nav-backdrop {
		display: none !important;
	}

	.mm-navbar {
		padding-top: 1.25rem;
		padding-bottom: 0.35rem;
		background: transparent !important;
		backdrop-filter: none;
		-webkit-backdrop-filter: none;
		box-shadow: none;
	}

	.mm-navbar.top-nav-collapse {
		padding-top: 0.45rem;
		padding-bottom: 0.45rem;
	}

	.mm-navbar.top-nav-collapse .mm-brand-name {
		color: var(--mm-charcoal);
	}

	.mm-navbar.top-nav-collapse .mm-brand-tag {
		color: var(--mm-primary);
	}

	.mm-navbar.top-nav-collapse .mm-nav-link {
		color: var(--mm-muted) !important;
	}

	.mm-navbar.top-nav-collapse .mm-nav-link:hover {
		color: var(--mm-charcoal) !important;
	}

	.offcanvas-collapse {
		position: static;
		top: auto;
		bottom: auto;
		left: auto;
		right: auto;
		width: auto;
		height: auto !important;
		max-height: none !important;
		padding: 0;
		background: transparent;
		overflow: visible;
		visibility: visible;
		opacity: 1 !important;
		transform: none !important;
		display: flex;
		flex-direction: row;
		align-items: center;
		flex: 1 1 auto;
		justify-content: flex-end;
		z-index: auto;
		box-shadow: none;
	}

	.offcanvas-collapse.open {
		transform: none !important;
	}

	.mm-nav-list {
		flex: 0 1 auto;
		overflow: visible;
		padding-bottom: 0;
		margin-top: 0;
	}

	.mm-navbar .navbar-nav {
		margin-top: 0;
		align-items: center;
	}
}

/* ---------- Buttons ---------- */
.mm-btn {
	font-family: var(--mm-font-body);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 0.85rem 1.5rem;
	border-radius: var(--mm-radius);
	border: 1px solid transparent;
	transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.mm-btn:hover {
	transform: translateY(-1px);
	box-shadow: var(--mm-shadow-sm);
}

.mm-btn-solid {
	background: linear-gradient(165deg, var(--mm-primary-soft) 0%, var(--mm-primary) 45%, var(--mm-primary-deep) 100%);
	border-color: transparent;
	color: var(--mm-cream) !important;
	box-shadow: 0 4px 16px rgba(9, 32, 66, 0.3);
}

.mm-btn-solid:hover {
	background: linear-gradient(165deg, var(--mm-primary-soft) 0%, var(--mm-primary-deep) 100%);
	color: var(--mm-white) !important;
	box-shadow: 0 8px 24px rgba(9, 32, 66, 0.4);
}

.mm-btn-outline {
	background: transparent;
	border-color: rgba(247, 244, 239, 0.55);
	color: var(--mm-cream) !important;
}

.mm-btn-outline:hover {
	background: rgba(255, 255, 255, 0.08);
	border-color: var(--mm-cream);
	color: var(--mm-white) !important;
}

.mm-navbar.top-nav-collapse .mm-btn-outline {
	border-color: var(--mm-charcoal);
	color: var(--mm-charcoal) !important;
}

.mm-navbar.top-nav-collapse .mm-btn-outline:hover {
	background: var(--mm-charcoal);
	color: var(--mm-cream) !important;
}

.mm-btn-ghost {
	background: transparent;
	border-color: transparent;
	color: rgba(247, 244, 239, 0.9) !important;
	text-decoration: underline;
	text-underline-offset: 4px;
	box-shadow: none;
}

.mm-btn-ghost:hover {
	color: var(--mm-white) !important;
	transform: none;
	box-shadow: none;
}

.mm-navbar.top-nav-collapse .mm-btn-ghost {
	color: var(--mm-primary) !important;
}

.mm-section .mm-btn-outline {
	border-color: var(--mm-charcoal);
	color: var(--mm-charcoal) !important;
}

.mm-section .mm-btn-outline:hover {
	background: var(--mm-charcoal);
	color: var(--mm-cream) !important;
}

/* ---------- Hero ---------- */
.mm-hero {
	position: relative;
	color: var(--mm-cream);
	overflow: hidden;
}

.mm-hero-container {
	max-width: 100%;
	position: relative;
	z-index: 3;
}

.mm-hero-ledger-note--short {
	display: block;
	font-size: 0.76rem;
	font-weight: 500;
	letter-spacing: 0.03em;
	text-transform: none;
	color: rgba(226, 222, 214, 0.52);
	line-height: 1.45;
	margin-top: 0.2rem;
}

.mm-hero-bg {
	position: absolute;
	inset: -10% 0 0 0;
	z-index: 0;
	background:
		linear-gradient(118deg, var(--mm-hero-edge) 0%, var(--mm-hero-mid) 38%, rgba(18, 52, 56, 0.93) 72%, var(--mm-hero-edge) 100%),
		radial-gradient(ellipse 95% 75% at 92% -5%, var(--mm-hero-glow), transparent 55%),
		radial-gradient(ellipse 55% 45% at 0% 105%, var(--mm-hero-floor), transparent 52%),
		radial-gradient(ellipse 50% 40% at 50% 120%, rgba(30, 74, 80, 0.25), transparent 55%),
		linear-gradient(180deg, rgba(15, 20, 28, 0.62) 0%, rgba(15, 22, 30, 0.45) 45%, rgba(18, 40, 44, 0.55) 100%),
		url("../images/1.jpeg");
	background-size: auto, auto, auto, auto, auto, cover;
	background-position: 0 0, 0 0, 0 0, 0 0, 0 0, 72% 18%;
	background-repeat: no-repeat;
	pointer-events: none;
	will-change: transform;
	transition: transform 0.15s var(--mm-ease-out);
}

.mm-hero-blobs {
	position: absolute;
	inset: 0;
	overflow: hidden;
	pointer-events: none;
	z-index: 1;
}

.mm-blob {
	position: absolute;
	border-radius: 50%;
	filter: blur(80px);
	opacity: 0.35;
	animation: mmBlobFloat 22s ease-in-out infinite;
}

.mm-blob-a {
	width: min(55vw, 420px);
	height: min(55vw, 420px);
	background: rgba(212, 188, 148, 0.38);
	top: -12%;
	right: -8%;
	animation-delay: 0s;
}

.mm-blob-b {
	width: min(45vw, 360px);
	height: min(45vw, 360px);
	background: rgba(42, 97, 104, 0.42);
	bottom: 5%;
	left: -15%;
	animation-delay: -7s;
}

.mm-blob-c {
	width: min(35vw, 280px);
	height: min(35vw, 280px);
	background: rgba(36, 50, 64, 0.5);
	top: 40%;
	left: 35%;
	animation-delay: -12s;
}

@keyframes mmBlobFloat {
	0%, 100% { transform: translate(0, 0) scale(1); }
	33% { transform: translate(2%, 4%) scale(1.05); }
	66% { transform: translate(-3%, 2%) scale(0.96); }
}

.mm-hero-noise {
	position: absolute;
	inset: 0;
	z-index: 2;
	opacity: 0.04;
	pointer-events: none;
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
	mix-blend-mode: overlay;
}

.mm-hero-row {
	padding-top: var(--mm-nav-offset, var(--mm-nav-h));
	padding-bottom: 2rem;
}

.mm-hero-gridline {
	position: absolute;
	z-index: 1;
	pointer-events: none;
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: 2px;
	opacity: 0.85;
}

.mm-hero-gridline--tl {
	width: min(42vw, 320px);
	height: min(42vw, 320px);
	top: calc(var(--mm-nav-offset, var(--mm-nav-h)) + 1.5rem);
	left: 2%;
	border-right: none;
	border-bottom: none;
}

.mm-hero-gridline--br {
	width: min(48vw, 380px);
	height: min(48vw, 380px);
	bottom: 8%;
	right: 3%;
	border-left: none;
	border-top: none;
}

@media (max-width: 991px) {
	.mm-hero-gridline {
		display: none;
	}
}

.mm-kicker {
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--mm-accent-light);
	margin-bottom: 0;
}

.mm-kicker-on-dark {
	color: rgba(212, 188, 148, 0.92);
}

.mm-display {
	font-size: clamp(2.85rem, 6.2vw, 4.45rem);
	line-height: 1.04;
	font-weight: 600;
	margin-bottom: 1rem;
	letter-spacing: -0.03em;
	background: linear-gradient(
		125deg,
		#ffffff 0%,
		#f4f1eb 35%,
		#e2dfd8 52%,
		var(--mm-accent-light) 58%,
		#eef2f1 72%,
		#faf8f5 100%
	);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.mm-hero-role {
	font-family: var(--mm-font-body);
	font-size: 0.9375rem;
	font-weight: 500;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: rgba(236, 232, 224, 0.72);
	max-width: 36rem;
	line-height: 1.55;
}

.mm-lead {
	font-size: 1.0625rem;
	line-height: 1.75;
	color: rgba(244, 242, 238, 0.9);
	max-width: 36rem;
}

.mm-lead strong {
	color: var(--mm-white);
	font-weight: 600;
}

.mm-hero-cta .btn {
	margin-right: 0.5rem;
	margin-bottom: 0.5rem;
}

.mm-quote {
	font-family: var(--mm-font-display);
	font-size: 1.2rem;
	line-height: 1.55;
	font-style: italic;
	color: rgba(238, 236, 232, 0.88);
	border-left: 3px solid var(--mm-accent);
	padding-left: 1.25rem;
	margin: 0;
}

.mm-quote p {
	margin: 0;
}

.mm-profile-shell {
	max-width: 340px;
	position: relative;
}

.mm-profile-shell::before {
	content: "";
	position: absolute;
	inset: -14px -10px auto auto;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	background: radial-gradient(circle at 30% 30%, rgba(212, 188, 148, 0.22), transparent 62%);
	pointer-events: none;
}

.mm-profile-card {
	max-width: 100%;
}

.mm-profile-frame {
	padding: 3px;
	background: linear-gradient(
		135deg,
		var(--mm-accent-light) 0%,
		var(--mm-primary-soft) 38%,
		var(--mm-primary) 62%,
		var(--mm-navy) 100%
	);
	background-size: 200% 200%;
	border-radius: var(--mm-radius-lg);
	box-shadow: var(--mm-shadow-glow);
	animation: mmFrameGlow 9s ease infinite;
	transition: transform 0.45s var(--mm-ease-out), box-shadow 0.35s ease;
}

.mm-js-tilt:hover .mm-profile-frame {
	box-shadow: var(--mm-shadow-glow), 0 28px 56px rgba(18, 42, 48, 0.2);
}

@keyframes mmFrameGlow {
	0%, 100% { background-position: 0% 50%; }
	50% { background-position: 100% 50%; }
}

.mm-profile-placeholder {
	position: relative;
	overflow: hidden;
	aspect-ratio: 4 / 5;
	border-radius: calc(var(--mm-radius-lg) - 3px);
	background:
		linear-gradient(155deg, rgba(30, 74, 80, 0.55) 0%, rgba(18, 24, 32, 0.82) 100%),
		url("../images/header-background.jpg") center / cover no-repeat;
	display: flex;
	align-items: center;
	justify-content: center;
}

.mm-profile-placeholder:has(.mm-profile-img) {
	background: linear-gradient(155deg, rgba(30, 74, 80, 0.25) 0%, rgba(18, 24, 32, 0.45) 100%);
}

.mm-profile-img {
	position: absolute;
	inset: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 18%;
	display: block;
}

.mm-profile-placeholder::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background: linear-gradient(
		118deg,
		transparent 0%,
		rgba(255, 255, 255, 0.06) 45%,
		transparent 78%
	);
}

.mm-profile-placeholder:has(.mm-profile-img)::after {
	background:
		var(--mm-photo-overlay-soft),
		linear-gradient(
			118deg,
			transparent 0%,
			rgba(255, 255, 255, 0.05) 45%,
			transparent 78%
		);
}

.mm-profile-initials {
	font-family: var(--mm-font-display);
	font-size: clamp(3.25rem, 8vw, 4.25rem);
	font-weight: 600;
	color: rgba(244, 240, 234, 0.26);
	letter-spacing: 0.08em;
	user-select: none;
}

.mm-profile-caption {
	margin-top: 1.15rem;
	text-align: center;
	padding: 0 0.5rem;
}

.mm-profile-caption-name {
	display: block;
	font-family: var(--mm-font-display);
	font-size: 1.2rem;
	font-weight: 600;
	color: rgba(248, 245, 240, 0.95);
	letter-spacing: 0.02em;
}

.mm-profile-caption-meta {
	display: block;
	font-size: 0.7rem;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: rgba(212, 188, 148, 0.78);
	margin-top: 0.35rem;
}

/* ---------- Editorial photos (m2–m4) ---------- */
.mm-about-photo {
	margin: 0 auto;
	max-width: min(420px, 86vw);
	overflow: hidden;
	border-radius: var(--mm-radius-lg);
	border: 1px solid var(--mm-line);
	box-shadow:
		var(--mm-shadow-sm),
		inset 0 0 0 1px rgba(255, 255, 255, 0.65);
	background: linear-gradient(165deg, #f0eeeb 0%, var(--mm-white) 45%, #e8ecef 100%);
}

.mm-about-photo-inner {
	position: relative;
	overflow: hidden;
	border-radius: calc(var(--mm-radius-lg) - 1px) calc(var(--mm-radius-lg) - 1px) 0 0;
	background: linear-gradient(145deg, var(--mm-charcoal-soft) 0%, var(--mm-slate) 100%);
}

/* Softens JPEG artifacts: grey wash + vignette + paper glaze + fine grain */
.mm-about-photo-inner::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	border-radius: inherit;
	box-shadow:
		inset 0 0 0 1px rgba(255, 255, 255, 0.12),
		inset 0 0 48px 20px rgba(250, 248, 244, 0.45),
		inset 0 -24px 56px rgba(26, 34, 44, 0.18);
	background:
		var(--mm-photo-overlay-soft),
		radial-gradient(
			ellipse 72% 68% at 50% 48%,
			transparent 0%,
			transparent 42%,
			rgba(26, 34, 44, 0.07) 100%
		);
}

.mm-about-photo-inner::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 3;
	pointer-events: none;
	opacity: 0.22;
	mix-blend-mode: overlay;
	border-radius: inherit;
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)' opacity='0.5'/%3E%3C/svg%3E");
}

.mm-about-photo-img {
	position: relative;
	z-index: 1;
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	object-position: center 30%;
	filter: saturate(0.92) contrast(1.04) brightness(1.02);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.mm-about-photo-cap {
	margin: 0;
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--mm-muted);
	padding: 0.65rem 1rem 0.85rem;
	background: linear-gradient(180deg, rgba(250, 250, 248, 0.98) 0%, var(--mm-white) 100%);
	border-top: 1px solid var(--mm-line);
}

.mm-speaking-photo {
	position: relative;
	margin: 0;
	overflow: hidden;
	border-radius: var(--mm-radius-lg);
	border: 1px solid var(--mm-line);
	box-shadow: var(--mm-shadow-sm);
}

.mm-speaking-photo::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	border-radius: inherit;
	background: var(--mm-photo-overlay);
}

.mm-speaking-photo-img {
	position: relative;
	z-index: 1;
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	max-height: 420px;
	object-fit: cover;
	object-position: center 15%;
}

/* Wide event artwork/screenshots in speaking section */
.mm-speaking-photo-img--wide {
	aspect-ratio: 3 / 4;
	max-height: 520px;
	object-fit: contain;
	object-position: center center;
	background: linear-gradient(170deg, #0a1f3d 0%, #173e73 100%);
	padding: 0.35rem;
}

@media (min-width: 768px) {
	.mm-speaking-photo-img {
		max-height: none;
	}
}

.mm-hero-ledger {
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	padding-top: 1.75rem;
	margin-top: 0.5rem;
}

.mm-hero-ledger-head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.75rem 1.25rem;
	margin-bottom: 1rem;
}

.mm-hero-ledger-kicker {
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: rgba(209, 235, 104, 0.9);
}

.mm-hero-ledger-note {
	font-size: 0.78rem;
	color: rgba(230, 226, 218, 0.45);
	letter-spacing: 0.02em;
}

.mm-credibility {
	margin-left: -0.5rem;
	margin-right: -0.5rem;
}

.mm-cred-item {
	padding: 0.5rem;
}

.mm-cred-tile {
	height: 100%;
	padding: 1.15rem 1rem 1.25rem;
	border-radius: calc(var(--mm-radius-lg) - 2px);
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.1);
	box-shadow: 0 18px 40px rgba(0, 0, 0, 0.12);
	transition: border-color 0.35s ease, background 0.35s ease, transform 0.35s var(--mm-ease-out);
}

.mm-cred-tile:hover {
	background: rgba(255, 255, 255, 0.07);
	border-color: rgba(209, 235, 104, 0.32);
	transform: translateY(-2px);
}

.mm-cred-value {
	display: block;
	font-family: var(--mm-font-display);
	font-size: clamp(1.35rem, 3.2vw, 1.65rem);
	font-weight: 600;
	color: var(--mm-cream);
	line-height: 1.15;
}

.mm-cred-label {
	display: block;
	font-size: 0.68rem;
	font-weight: 500;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: rgba(220, 216, 208, 0.55);
	margin-top: 0.45rem;
	max-width: 14rem;
}

/* ---------- Sections ---------- */
.mm-section {
	padding: clamp(4.25rem, 8vw, 6rem) 0;
	position: relative;
}

.mm-section:not(.mm-hero)::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	width: min(1120px, 92vw);
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--mm-line) 20%, var(--mm-line) 80%, transparent);
	pointer-events: none;
	opacity: 0.85;
}

.mm-section-alt {
	background: linear-gradient(188deg, #e7effb 0%, #edf3fc 42%, #f6f9ff 100%);
}

.mm-section-soft {
	background: linear-gradient(180deg, #ecf2fc 0%, #f4f8ff 55%, #f7faff 100%);
	border-top: 1px solid var(--mm-line);
	border-bottom: 1px solid var(--mm-line);
}

.mm-section-dark {
	background: linear-gradient(168deg, #07172f 0%, var(--mm-slate) 44%, #143b73 72%, #081a32 100%);
	color: rgba(236, 234, 230, 0.9);
	padding: clamp(4.25rem, 8vw, 6rem) 0;
}

.mm-section-impact {
	position: relative;
	overflow: hidden;
}

.mm-section-impact::after {
	content: "";
	position: absolute;
	inset: auto -20% -45% -20%;
	height: 55%;
	background: radial-gradient(ellipse at 50% 0%, rgba(212, 188, 148, 0.09), transparent 55%);
	pointer-events: none;
}

.mm-section-dark::before {
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.07) 25%, rgba(255, 255, 255, 0.07) 75%, transparent);
	opacity: 0.55;
}

.mm-section-contact {
	background: linear-gradient(182deg, #f1f6ff 0%, var(--mm-paper) 45%, #e8f0fb 100%);
	border-top: 1px solid var(--mm-line);
}

/* Section backgrounds — photos as atmosphere + grey blend (paths relative to css/) */
#about.mm-section-alt {
	overflow: hidden;
	background-image:
		linear-gradient(188deg, rgba(244, 242, 238, 0.95) 0%, rgba(247, 245, 242, 0.92) 42%, rgba(244, 242, 238, 0.96) 100%),
		linear-gradient(95deg, rgba(36, 50, 64, 0.2) 0%, rgba(36, 50, 64, 0.08) 45%, transparent 62%),
		url("../images/2.jpeg");
	background-size: auto, auto, min(440px, 50vw) auto;
	background-position: center, center, 106% 32%;
	background-repeat: no-repeat, no-repeat, no-repeat;
}

#speaking.mm-section-soft {
	overflow: hidden;
	background-image:
		linear-gradient(180deg, rgba(242, 244, 246, 0.94) 0%, rgba(250, 248, 245, 0.93) 100%),
		linear-gradient(118deg, transparent 0%, rgba(36, 50, 64, 0.12) 58%, rgba(36, 50, 64, 0.18) 100%),
		url("../images/3.jpeg");
	background-size: auto, auto, cover;
	background-position: center, center, 8% 38%;
	background-repeat: no-repeat, no-repeat, no-repeat;
}

#impact.mm-section-dark {
	background-image:
		linear-gradient(168deg, rgba(15, 22, 32, 0.94) 0%, rgba(36, 50, 64, 0.9) 50%, rgba(14, 58, 64, 0.93) 100%),
		linear-gradient(180deg, rgba(36, 50, 64, 0.38) 0%, rgba(12, 18, 26, 0.62) 100%),
		url("../images/4.jpeg");
	background-size: auto, auto, cover;
	background-position: center, center, 78% 22%;
	background-repeat: no-repeat, no-repeat, no-repeat;
}

#expertise.mm-section-alt {
	overflow: hidden;
	background-image:
		linear-gradient(188deg, rgba(228, 233, 238, 0.96) 0%, rgba(239, 234, 228, 0.95) 42%, rgba(247, 245, 242, 0.96) 100%),
		linear-gradient(255deg, transparent 55%, rgba(36, 50, 64, 0.1) 100%),
		url("../images/5.jpeg");
	background-size: auto, auto, min(360px, 34vw) auto;
	background-position: center, center, -4% 58%;
	background-repeat: no-repeat, no-repeat, no-repeat;
}

#contact.mm-section-contact {
	overflow: hidden;
	background-image:
		linear-gradient(182deg, rgba(248, 249, 251, 0.94) 0%, rgba(250, 250, 248, 0.92) 48%, rgba(238, 241, 244, 0.95) 100%),
		linear-gradient(88deg, rgba(36, 50, 64, 0.1) 0%, transparent 52%),
		url("../images/5.jpeg");
	background-size: auto, auto, min(400px, 44vw) auto;
	background-position: center, center, 104% 48%;
	background-repeat: no-repeat, no-repeat, no-repeat;
}

#about > .container,
#speaking > .container,
#impact > .container,
#expertise > .container,
#contact > .container {
	position: relative;
	z-index: 1;
}

.mm-contact-panel {
	padding: 0;
	border-radius: calc(var(--mm-radius-lg) + 4px);
	border: 1px solid var(--mm-line);
	background: var(--mm-white);
	box-shadow: 0 28px 60px rgba(22, 40, 48, 0.08);
}

.mm-contact-panel-main {
	padding: clamp(1.75rem, 4vw, 2.75rem) clamp(1.25rem, 4vw, 2.35rem);
}

.mm-contact-photo-col {
	position: relative;
	background: var(--mm-charcoal);
}

.mm-contact-photo {
	margin: 0;
	position: relative;
	overflow: hidden;
	min-height: 240px;
}

.mm-contact-photo::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background: var(--mm-photo-overlay);
}

.mm-contact-photo-img {
	position: relative;
	z-index: 1;
	display: block;
	width: 100%;
	height: 100%;
	min-height: 240px;
	object-fit: cover;
	object-position: center 20%;
}

@media (min-width: 768px) {
	.mm-contact-photo-col {
		align-self: stretch;
		min-height: 100%;
	}

	.mm-contact-photo {
		position: absolute;
		inset: 0;
		min-height: 100%;
	}

	.mm-contact-photo-img {
		position: absolute;
		inset: 0;
		z-index: 1;
		width: 100%;
		height: 100%;
		min-height: 0;
	}
}

.mm-contact-panel-head .mm-heading {
	margin-bottom: 0.75rem;
}

.mm-contact-panel-head .mm-lead-contact {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.mm-contact-sub {
	font-size: 0.95rem;
	line-height: 1.65;
	color: var(--mm-muted);
	max-width: 36rem;
	margin-top: 0.75rem;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.mm-contact-divider {
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--mm-line-strong), transparent);
	margin: 1.75rem auto 1.5rem;
	max-width: 280px;
}

.mm-contact-loc {
	font-size: 0.9rem;
}

.mm-contact-hint {
	max-width: 32rem;
	margin-left: auto;
	margin-right: auto;
	margin-top: 1.5rem !important;
	line-height: 1.55;
}

.mm-contact-secondary {
	margin-top: 1.25rem;
	padding-top: 0.5rem;
}

.mm-section-contact .mm-btn-ghost {
	color: var(--mm-primary) !important;
	text-decoration: none;
	border: 1px solid transparent;
}

.mm-section-contact .mm-btn-ghost:hover {
	color: var(--mm-charcoal) !important;
	border-color: var(--mm-line-strong);
	background: rgba(30, 74, 80, 0.04);
	transform: translateY(-1px);
}

.mm-contact-primary {
	min-width: 200px;
}

.mm-section-head {
	margin-bottom: 0.5rem;
}

.mm-heading {
	font-size: clamp(2rem, 4vw, 2.75rem);
	line-height: 1.15;
	margin-bottom: 1rem;
}

.mm-subhead {
	font-size: 1.05rem;
	line-height: 1.75;
	color: var(--mm-muted);
	max-width: 38rem;
}

.mm-subhead-on-dark {
	color: rgba(220, 218, 212, 0.72);
}

.mm-h3 {
	font-size: 1.35rem;
	margin-bottom: 0.75rem;
}

.mm-lead-contact {
	font-size: 1.1rem;
	line-height: 1.7;
	color: var(--mm-muted);
	margin-bottom: 1.5rem;
	max-width: 38rem;
}

.mm-contact-actions {
	margin-left: -0.35rem;
	margin-right: -0.35rem;
}

.mm-contact-action {
	margin: 0.35rem;
}

.mm-btn-whatsapp {
	background: #128c7e !important;
	border: 1px solid #128c7e !important;
	color: #ffffff !important;
	box-shadow: 0 4px 16px rgba(18, 140, 126, 0.28);
}

.mm-btn-whatsapp:hover {
	background: #0e7266 !important;
	border-color: #0e7266 !important;
	color: #ffffff !important;
	box-shadow: 0 6px 22px rgba(12, 92, 82, 0.32);
}

.mm-section-contact .mm-btn-outline.mm-btn-contact-email {
	border-color: var(--mm-primary);
	color: var(--mm-primary) !important;
}

.mm-section-contact .mm-btn-outline.mm-btn-contact-email:hover {
	background: var(--mm-primary);
	color: var(--mm-cream) !important;
}

/* ---------- Cards ---------- */
.mm-card {
	background: var(--mm-white);
	border: 1px solid var(--mm-line);
	border-radius: var(--mm-radius-lg);
	box-shadow: var(--mm-shadow-sm);
	transition: transform 0.4s var(--mm-ease-out), box-shadow 0.4s ease, border-color 0.35s ease;
	position: relative;
	overflow: hidden;
}

.mm-card:not(.mm-js-tilt-card):hover {
	transform: translateY(-4px);
	box-shadow: var(--mm-shadow);
	border-color: rgba(30, 74, 80, 0.18);
}

.mm-js-tilt-card {
	transition: transform 0.2s var(--mm-ease-out), box-shadow 0.35s ease, border-color 0.35s ease;
	transform-style: preserve-3d;
}

.mm-js-tilt-card:hover {
	box-shadow: var(--mm-shadow);
	border-color: rgba(30, 74, 80, 0.2);
}

.mm-card-shine::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(
		115deg,
		transparent 0%,
		transparent 40%,
		rgba(255, 255, 255, 0.45) 50%,
		transparent 60%,
		transparent 100%
	);
	background-size: 220% 100%;
	opacity: 0;
	transition: opacity 0.35s ease, background-position 0s linear;
	pointer-events: none;
	border-radius: inherit;
}

.mm-card-shine:hover::after {
	opacity: 0.55;
	background-position: 100% 0;
	transition: opacity 0.4s ease, background-position 0.65s var(--mm-ease-out);
}

.mm-card-pad {
	padding: 1.75rem 1.5rem;
}

.mm-card-accent {
	border-color: rgba(30, 74, 80, 0.12);
	background: linear-gradient(145deg, #ffffff 0%, var(--mm-surface-elevated) 55%, #fafaf8 100%);
}

.mm-pill-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.mm-pill {
	font-size: 0.75rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	padding: 0.4rem 0.75rem;
	border-radius: 100px;
	background: rgba(30, 74, 80, 0.07);
	color: var(--mm-primary);
	border: 1px solid rgba(30, 74, 80, 0.12);
}

.mm-list-check li {
	position: relative;
	padding-left: 1.5rem;
	margin-bottom: 0.65rem;
}

.mm-list-check li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.55rem;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--mm-accent-light), var(--mm-primary-soft));
}

.mm-list {
	padding-left: 1.1rem;
	margin: 0;
}

.mm-list li {
	margin-bottom: 0.5rem;
	padding-left: 0.25rem;
}

.mm-role-meta {
	font-size: 0.9rem;
	color: var(--mm-muted);
}

.mm-flex-gaps {
	margin: -0.3rem -0.35rem;
}

.mm-flex-gaps > * {
	margin: 0.3rem 0.35rem;
}

.mm-badge {
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 0.35rem 0.65rem;
	border-radius: 4px;
	background: linear-gradient(165deg, var(--mm-charcoal-soft) 0%, var(--mm-charcoal) 100%);
	color: var(--mm-cream);
	white-space: nowrap;
}

.mm-badge-soft {
	background: rgba(30, 74, 80, 0.1);
	color: var(--mm-primary);
}

.mm-role-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
}

.mm-role-tag {
	font-size: 0.62rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	padding: 0.32rem 0.6rem;
	border-radius: 100px;
	border: 1px solid rgba(30, 74, 80, 0.14);
	background: rgba(30, 74, 80, 0.05);
	color: var(--mm-primary-deep);
}

.mm-role-tag--soft {
	border-color: var(--mm-line);
	background: rgba(255, 255, 255, 0.65);
	color: var(--mm-muted);
}

.mm-role-tag--accent {
	border-color: rgba(184, 148, 106, 0.45);
	background: rgba(184, 148, 106, 0.12);
	color: var(--mm-accent-deep);
}

.mm-outcome-strip {
	display: flex;
	flex-wrap: wrap;
	gap: 0.65rem 1.25rem;
	padding: 0.85rem 1rem;
	border-radius: var(--mm-radius);
	border: 1px solid var(--mm-line);
	background: linear-gradient(135deg, rgba(30, 74, 80, 0.05) 0%, rgba(255, 255, 255, 0.92) 100%);
}

.mm-outcome-strip--compact {
	padding: 0.65rem 0.9rem;
	gap: 0.5rem 1rem;
}

.mm-outcome-strip li {
	font-size: 0.8125rem;
	line-height: 1.45;
	color: var(--mm-muted);
	margin: 0;
}

.mm-outcome-strip-val {
	font-family: var(--mm-font-display);
	font-weight: 600;
	font-size: 1.05rem;
	color: var(--mm-charcoal);
	margin-right: 0.35rem;
}

.mm-outcome-strip-lbl {
	font-size: 0.78rem;
	letter-spacing: 0.02em;
}

/* ---------- Timeline ---------- */
.mm-timeline {
	position: relative;
	max-width: 880px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 0;
}

.mm-timeline::before {
	content: "";
	position: absolute;
	left: 11px;
	top: 0;
	bottom: 0;
	width: 1px;
	background: linear-gradient(180deg, var(--mm-accent), rgba(30, 74, 80, 0.28));
}

.mm-timeline-item {
	position: relative;
	padding-left: 2.75rem;
	margin-bottom: 2rem;
}

.mm-timeline-marker {
	position: absolute;
	left: 4px;
	top: 1.35rem;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background: var(--mm-white);
	border: 3px solid var(--mm-accent);
	box-shadow: 0 0 0 4px rgba(184, 148, 106, 0.22);
}

.mm-timeline-card {
	margin-left: 0;
}

@media (min-width: 768px) {
	.mm-timeline::before {
		left: 19px;
	}

	.mm-timeline-item {
		padding-left: 3.5rem;
	}

	.mm-timeline-marker {
		left: 12px;
	}
}

/* ---------- Impact stats ---------- */
.mm-stat-card {
	text-align: center;
	padding: 1.75rem 1rem;
	margin-bottom: 1rem;
	border-radius: var(--mm-radius-lg);
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.08);
	min-height: 140px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	transition: background 0.35s ease, border-color 0.35s ease, transform 0.35s var(--mm-ease-out);
}

.mm-stat-card:hover {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(209, 235, 104, 0.32);
	transform: translateY(-2px);
}

.mm-stat-card--hero {
	min-height: 168px;
	padding: 2rem 1.25rem;
	background: linear-gradient(155deg, rgba(255, 255, 255, 0.09) 0%, rgba(255, 255, 255, 0.03) 100%);
	border-color: rgba(212, 188, 148, 0.22);
}

.mm-stat-card--hero .mm-stat-num {
	font-size: clamp(2.15rem, 5vw, 2.85rem);
}

.mm-impact-dashboard {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	gap: 2.5rem;
}

.mm-impact-band {
	padding: 1.75rem 1.5rem 1.5rem;
	border-radius: calc(var(--mm-radius-lg) + 2px);
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid rgba(255, 255, 255, 0.08);
	box-shadow: 0 20px 48px rgba(0, 0, 0, 0.18);
}

.mm-impact-band-head {
	display: flex;
	gap: 1.25rem;
	align-items: flex-start;
	margin-bottom: 1.5rem;
	padding-bottom: 1.25rem;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.mm-impact-band-index {
	flex: 0 0 auto;
	font-family: var(--mm-font-display);
	font-size: 1.5rem;
	font-weight: 600;
	color: rgba(209, 235, 104, 0.62);
	line-height: 1;
	min-width: 2.25rem;
}

.mm-impact-band-title {
	font-family: var(--mm-font-display);
	font-size: clamp(1.2rem, 2.4vw, 1.45rem);
	font-weight: 600;
	color: #f4f1ec !important;
	margin-bottom: 0.35rem;
	letter-spacing: -0.01em;
}

.mm-impact-band-desc {
	font-size: 0.9rem;
	line-height: 1.6;
	color: rgba(218, 214, 206, 0.62);
	max-width: 46rem;
}

.mm-stat-prefix {
	display: block;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--mm-accent-light);
	margin-bottom: 0.15rem;
}

.mm-stat-num {
	font-family: var(--mm-font-display);
	font-size: clamp(1.75rem, 4vw, 2.35rem);
	font-weight: 600;
	line-height: 1;
	color: var(--mm-cream);
}

.mm-stat-label {
	display: block;
	font-size: 0.7rem;
	font-weight: 500;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: rgba(210, 206, 198, 0.58);
	margin-top: 0.65rem;
	max-width: 11rem;
	margin-left: auto;
	margin-right: auto;
}

.mm-section-dark .mm-heading.text-white {
	color: #f4f1ec !important;
	letter-spacing: -0.02em;
}

/* ---------- Services ---------- */
.mm-service-icon {
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--mm-radius);
	background: rgba(30, 74, 80, 0.08);
	color: var(--mm-primary);
	margin-bottom: 1rem;
	font-size: 1rem;
	transition: background 0.35s ease, color 0.35s ease, transform 0.35s var(--mm-ease-out);
}

.mm-service-card:hover .mm-service-icon {
	background: linear-gradient(145deg, var(--mm-primary-soft), var(--mm-primary));
	color: var(--mm-cream);
	transform: translateY(-1px);
}

/* ---------- Case studies ---------- */
.mm-case {
	border-radius: var(--mm-radius-lg);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	height: 100%;
}

.mm-case-top {
	padding: 1.35rem 1.5rem 1rem;
	border-bottom: 1px solid var(--mm-line);
	background: linear-gradient(180deg, rgba(30, 74, 80, 0.04) 0%, rgba(255, 255, 255, 0.5) 100%);
	position: relative;
	z-index: 1;
}

.mm-case-eyebrow {
	display: block;
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--mm-primary);
	margin-bottom: 0.45rem;
}

.mm-case-body {
	padding: 1.35rem 1.5rem 1.5rem;
	position: relative;
	z-index: 1;
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.mm-case-block {
	padding: 0.95rem 1rem;
	border-radius: var(--mm-radius);
	border: 1px solid var(--mm-line);
	background: var(--mm-white);
}

.mm-case-block--challenge {
	border-left: 3px solid rgba(90, 101, 112, 0.35);
}

.mm-case-block--action {
	border-left: 3px solid rgba(30, 74, 80, 0.35);
}

.mm-case-block--result {
	border-left: 3px solid var(--mm-accent-deep);
	background: linear-gradient(135deg, rgba(184, 148, 106, 0.08) 0%, rgba(255, 255, 255, 0.95) 100%);
}

.mm-case-label {
	display: block;
	font-size: 0.62rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--mm-accent-deep);
	margin-bottom: 0.4rem;
}

.mm-proof-links {
	display: grid;
	gap: 0.55rem;
}

.mm-proof-links-label {
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--mm-primary-deep);
}

.mm-proof-link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.55rem 0.75rem;
	border-radius: var(--mm-radius);
	border: 1px solid rgba(19, 63, 125, 0.2);
	background: rgba(255, 255, 255, 0.9);
	color: var(--mm-primary-deep);
	font-size: 0.85rem;
	font-weight: 600;
	line-height: 1.3;
	width: fit-content;
	max-width: 100%;
}

.mm-proof-link:hover {
	background: rgba(209, 235, 104, 0.18);
	border-color: rgba(126, 159, 47, 0.45);
	color: var(--mm-primary-deep);
}

.mm-proof-link i {
	font-size: 0.95rem;
	color: var(--mm-primary);
}

.mm-case--featured {
	overflow: hidden;
}

.mm-case-feature-aside {
	padding: 0;
	overflow: hidden;
	display: grid;
	grid-template-rows: 1fr auto;
	min-height: 100%;
	background: var(--mm-navy);
}

.mm-case-feature-media {
	position: relative;
	min-height: 200px;
	overflow: hidden;
}

.mm-case-feature-media::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background: var(--mm-photo-overlay);
}

.mm-case-feature-img {
	position: absolute;
	inset: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 18%;
	display: block;
}

.mm-case-feature-aside-foot {
	padding: 1.35rem 1.5rem 1.65rem;
	background: linear-gradient(165deg, rgba(15, 22, 30, 0.97) 0%, var(--mm-navy) 100%);
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
}

.mm-case-feature-aside .mm-case-eyebrow {
	color: rgba(212, 188, 148, 0.85);
}

.mm-case-feature-aside .mm-h3 {
	color: #f4f1ec !important;
}

.mm-case-body--featured {
	padding: 1.75rem 1.5rem 1.75rem 1.75rem;
	height: 100%;
}

@media (max-width: 991px) {
	.mm-case-feature-aside {
		min-height: 0;
		grid-template-rows: minmax(200px, 48vw) auto;
	}

	.mm-case-feature-media {
		min-height: 200px;
	}

	.mm-case-feature-aside-foot {
		padding: 1.15rem 1.25rem 1.35rem;
	}
}

/* ---------- Education ---------- */
.mm-edu-icon {
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: linear-gradient(145deg, rgba(30, 74, 80, 0.12), rgba(184, 148, 106, 0.12));
	color: var(--mm-primary);
	margin-bottom: 1rem;
	font-size: 1.1rem;
}

/* ---------- Skills ---------- */
.mm-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem;
}

.mm-chips span {
	font-size: 0.8125rem;
	padding: 0.35rem 0.85rem;
	border-radius: 100px;
	background: var(--mm-white);
	border: 1px solid var(--mm-line);
	color: var(--mm-charcoal-soft);
	font-weight: 500;
	transition: border-color 0.2s ease, background 0.2s ease;
}

.mm-chips span:hover {
	border-color: rgba(30, 74, 80, 0.22);
	background: rgba(232, 236, 238, 0.85);
}

.mm-chips-muted span {
	background: rgba(255, 255, 255, 0.7);
}

.mm-lang-label {
	font-family: var(--mm-font-display);
	font-size: 1.25rem;
	font-weight: 600;
	color: var(--mm-charcoal);
}

.mm-speaking-list li {
	display: flex;
	align-items: flex-start;
	gap: 0.85rem;
	padding: 1rem 0;
	border-bottom: 1px solid var(--mm-line);
	font-size: 1rem;
}

.mm-speaking-list li:last-child {
	border-bottom: none;
}

.mm-speaking-list .fas {
	color: var(--mm-primary);
	margin-top: 0.2rem;
	width: 1.25rem;
	text-align: center;
}

.mm-testimonial {
	text-align: left;
	display: flex;
	flex-direction: column;
}

.mm-testimonial-quote {
	font-family: var(--mm-font-display);
	font-size: 1.08rem;
	font-style: italic;
	line-height: 1.58;
	color: var(--mm-charcoal-soft);
	margin: 0 0 1.35rem;
	padding: 0.5rem 0 0 1.35rem;
	position: relative;
}

.mm-testimonial-quote::before {
	content: "“";
	position: absolute;
	left: 0.15rem;
	top: -0.1rem;
	font-size: 2.35rem;
	line-height: 1;
	font-style: normal;
	color: rgba(30, 74, 80, 0.11);
	font-family: var(--mm-font-display);
	pointer-events: none;
}

.mm-testimonial-quote p {
	margin: 0;
}

.mm-testimonial-byline {
	margin-top: auto;
	padding-top: 1rem;
	border-top: 1px solid var(--mm-line);
}

.mm-testimonial-name {
	display: block;
	font-weight: 700;
	font-size: 0.9rem;
	color: var(--mm-charcoal);
	letter-spacing: 0.01em;
}

.mm-testimonial-role {
	display: block;
	font-size: 0.78rem;
	color: var(--mm-muted);
	margin-top: 0.2rem;
}

.mm-contact-list li {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	margin-bottom: 0.85rem;
	font-size: 0.95rem;
}

.mm-contact-list .fas,
.mm-contact-list .fab {
	color: var(--mm-primary);
	width: 1.25rem;
	text-align: center;
	margin-top: 0.15rem;
}

.mm-form-card {
	box-shadow: var(--mm-shadow);
}

/* ---------- Forms (floating labels) ---------- */
.form-group {
	position: relative;
	margin-bottom: 1.35rem;
}

.label-control {
	position: absolute;
	top: 0.95rem;
	left: 1.25rem;
	color: var(--mm-muted-light);
	font-size: 0.875rem;
	line-height: 1.4;
	cursor: text;
	transition: all 0.2s ease;
	pointer-events: none;
}

.form-control-input:focus + .label-control,
.form-control-input.notEmpty + .label-control,
.form-control-textarea:focus + .label-control,
.form-control-textarea.notEmpty + .label-control {
	top: 0.35rem;
	font-size: 0.7rem;
	font-weight: 700;
	color: var(--mm-primary);
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.form-control-input,
.form-control-textarea {
	display: block;
	width: 100%;
	padding: 1.35rem 1.25rem 0.5rem;
	border: 1px solid var(--mm-line);
	border-radius: var(--mm-radius);
	background: var(--mm-paper);
	color: var(--mm-charcoal);
	font-size: 0.9375rem;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.form-control-textarea {
	min-height: 10rem;
	padding-top: 1.5rem;
	resize: vertical;
}

.form-control-input:focus,
.form-control-textarea:focus {
	outline: none;
	border-color: rgba(30, 74, 80, 0.42);
	box-shadow: 0 0 0 3px rgba(30, 74, 80, 0.09);
}

.form-control-submit-button {
	display: inline-block;
	width: 100%;
	height: 3.1rem;
	border: none;
	border-radius: var(--mm-radius);
	background: linear-gradient(165deg, var(--mm-primary-soft) 0%, var(--mm-primary) 50%, var(--mm-primary-deep) 100%);
	color: var(--mm-cream);
	font-weight: 700;
	font-size: 0.75rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
	box-shadow: 0 4px 14px rgba(21, 58, 63, 0.22);
}

.form-control-submit-button:hover {
	background: linear-gradient(165deg, var(--mm-primary) 0%, var(--mm-primary-deep) 100%);
	transform: translateY(-1px);
	box-shadow: 0 6px 20px rgba(15, 42, 46, 0.28);
}

/* ---------- Footer ---------- */
.mm-footer {
	background: linear-gradient(180deg, var(--mm-ink) 0%, var(--mm-charcoal) 100%);
	color: rgba(228, 226, 222, 0.78);
	font-size: 0.9rem;
}

.mm-footer a {
	color: var(--mm-accent-light);
}

.mm-footer a:hover {
	color: var(--mm-cream);
}

.mm-footer strong {
	color: var(--mm-cream);
}

.mm-footer-rule {
	border-color: rgba(255, 255, 255, 0.08);
	margin: 0;
}

.mm-footer-link {
	color: rgba(247, 244, 239, 0.55) !important;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.mm-footer-link:hover {
	color: var(--mm-cream) !important;
}

/* ---------- Scroll progress ---------- */
.mm-scroll-progress {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	z-index: 1100;
	pointer-events: none;
	background: transparent;
}

.mm-scroll-progress-bar {
	display: block;
	height: 100%;
	width: 0%;
	background: linear-gradient(90deg, var(--mm-primary-deep), var(--mm-primary-soft), var(--mm-accent-light));
	transform-origin: 0 50%;
	transition: width 0.12s ease-out;
	box-shadow: 0 0 14px rgba(30, 74, 80, 0.35);
}

/* ---------- Credibility strip micro-animation ---------- */
.mm-hero-ledger .mm-cred-item {
	opacity: 0;
	transform: translateY(14px);
}

/* `both` fill-mode: hold first keyframe during delay, then keep final state after animation ends.
   Without `forwards`/`both`, opacity reverts to 0 from the base .mm-cred-item rule — metrics disappear. */
.mm-hero-ledger.mm-reveal-visible .mm-cred-item {
	animation: mmCredIn 0.65s var(--mm-ease-out) both;
}

.mm-hero-ledger.mm-reveal-visible .mm-cred-item:nth-child(1) { animation-delay: 0.08s; }
.mm-hero-ledger.mm-reveal-visible .mm-cred-item:nth-child(2) { animation-delay: 0.16s; }
.mm-hero-ledger.mm-reveal-visible .mm-cred-item:nth-child(3) { animation-delay: 0.24s; }
.mm-hero-ledger.mm-reveal-visible .mm-cred-item:nth-child(4) { animation-delay: 0.32s; }

@keyframes mmCredIn {
	from {
		opacity: 0;
		transform: translateY(14px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* ---------- Mobile nav stagger ---------- */
.offcanvas-collapse.open .navbar-nav > .nav-item {
	animation: mmNavSlide 0.45s var(--mm-ease-out) backwards;
}

.offcanvas-collapse.open .navbar-nav > .nav-item:nth-child(1) { animation-delay: 0.05s; }
.offcanvas-collapse.open .navbar-nav > .nav-item:nth-child(2) { animation-delay: 0.1s; }
.offcanvas-collapse.open .navbar-nav > .nav-item:nth-child(3) { animation-delay: 0.14s; }
.offcanvas-collapse.open .navbar-nav > .nav-item:nth-child(4) { animation-delay: 0.18s; }
.offcanvas-collapse.open .navbar-nav > .nav-item:nth-child(5) { animation-delay: 0.22s; }
.offcanvas-collapse.open .navbar-nav > .nav-item:nth-child(6) { animation-delay: 0.26s; }
.offcanvas-collapse.open .navbar-nav > .nav-item:nth-child(7) { animation-delay: 0.3s; }
.offcanvas-collapse.open .navbar-nav > .nav-item:nth-child(8) { animation-delay: 0.34s; }
.offcanvas-collapse.open .navbar-nav > .nav-item:nth-child(9) { animation-delay: 0.38s; }
.offcanvas-collapse.open .navbar-nav > .nav-item:nth-child(10) { animation-delay: 0.42s; }
.offcanvas-collapse.open .navbar-nav > .nav-item:nth-child(11) { animation-delay: 0.46s; }

@keyframes mmNavSlide {
	from {
		opacity: 0;
		transform: translateX(12px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

/* ---------- Button ripple ---------- */
.mm-btn-solid,
.mm-btn-outline,
.form-control-submit-button {
	position: relative;
	overflow: hidden;
}

.mm-ripple {
	position: absolute;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.45);
	transform: scale(0);
	animation: mmRipple 0.65s var(--mm-ease-out) forwards;
	pointer-events: none;
}

@keyframes mmRipple {
	to {
		transform: scale(2.8);
		opacity: 0;
	}
}

.mm-navbar.top-nav-collapse .mm-ripple {
	background: rgba(30, 74, 80, 0.18);
}

/* ---------- Focus visibility ---------- */
.mm-nav-link:focus-visible,
.mm-btn-solid:focus-visible,
.mm-btn-outline:focus-visible,
.mm-btn-whatsapp:focus-visible,
.mm-brand:focus-visible,
a.back-to-top:focus-visible {
	outline: 2px solid var(--mm-accent-light);
	outline-offset: 3px;
}

.form-control-input:focus-visible,
.form-control-textarea:focus-visible {
	outline: 2px solid var(--mm-primary);
	outline-offset: 2px;
}

/* ---------- Reveal on scroll ---------- */
.mm-reveal {
	opacity: 0;
	transform: translateY(28px);
	transition:
		opacity 0.75s var(--mm-ease-out) var(--mm-reveal-delay, 0ms),
		transform 0.75s var(--mm-ease-out) var(--mm-reveal-delay, 0ms);
}

.mm-reveal.mm-reveal-visible {
	opacity: 1;
	transform: none;
}

/* ---------- Back to top ---------- */
a.back-to-top {
	position: fixed;
	z-index: 1040;
	right: 16px;
	bottom: 16px;
	display: none;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: var(--mm-charcoal);
	color: var(--mm-cream) !important;
	text-align: center;
	line-height: 46px;
	font-size: 0.75rem;
	box-shadow: var(--mm-shadow);
	text-decoration: none !important;
	transition: transform 0.2s ease, background 0.2s ease;
}

a.back-to-top:hover {
	background: linear-gradient(145deg, var(--mm-primary), var(--mm-primary-deep));
	transform: translateY(-2px);
}

a.back-to-top i {
	vertical-align: middle;
}

/* ---------- Layer content above card shine ---------- */
.mm-service-card > *,
.mm-timeline-card > *,
.mm-edu-card > *,
.mm-skill-block > *,
.mm-testimonial > * {
	position: relative;
	z-index: 1;
}

/* ============================================================
   Legacy support — project / terms / privacy template pages
   ============================================================ */
.ex-header {
	padding-top: 8.5rem;
	padding-bottom: 4rem;
	background: linear-gradient(165deg, var(--mm-slate) 0%, var(--mm-primary-deep) 100%);
}

.ex-header h1 {
	color: var(--mm-cream);
	font-family: var(--mm-font-display);
}

.ex-basic-1 p,
.ex-basic-1 .text-box {
	color: var(--mm-muted);
}

.ex-basic-1 .text-box {
	background: var(--mm-paper);
	border: 1px solid var(--mm-line);
	border-radius: var(--mm-radius);
	padding: 1.25rem 1.5rem;
}

.ex-cards-1 .card {
	border: 1px solid var(--mm-line);
	border-radius: var(--mm-radius-lg);
}

.btn-solid-reg {
	display: inline-block;
	padding: 1rem 2rem;
	border: 1px solid transparent;
	background: linear-gradient(165deg, var(--mm-primary-soft), var(--mm-primary));
	color: var(--mm-cream) !important;
	font-weight: 600;
	font-size: 0.8125rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none !important;
	border-radius: var(--mm-radius);
	transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
	box-shadow: 0 4px 14px rgba(21, 58, 63, 0.2);
}

.btn-solid-reg:hover {
	background: linear-gradient(165deg, var(--mm-primary), var(--mm-primary-deep));
	color: var(--mm-white) !important;
	box-shadow: 0 6px 18px rgba(15, 42, 46, 0.28);
}

.footer.bg-gray,
.copyright.bg-gray {
	background: linear-gradient(180deg, #e4edfa 0%, #eaf2fd 100%) !important;
}

.footer .social-container a {
	color: var(--mm-primary);
}

.copyright .p-small {
	color: var(--mm-muted);
}

/* ---------- Mobile: menu contrast & tap targets ---------- */
@media (max-width: 991.98px) {
	body.mm-nav-open .offcanvas-collapse .mm-nav-link {
		color: rgba(247, 244, 239, 0.9) !important;
		border-bottom-color: transparent;
	}

	body.mm-nav-open .offcanvas-collapse .mm-nav-link:hover,
	body.mm-nav-open .offcanvas-collapse .mm-nav-link:focus {
		color: var(--mm-white) !important;
	}

	body.mm-nav-open .offcanvas-collapse .mm-nav-link.active {
		color: var(--mm-white) !important;
		border-bottom-color: var(--mm-accent-light);
	}

	.mm-navbar .mm-nav-list > .nav-item > .mm-nav-link {
		padding-top: 1rem !important;
		padding-bottom: 1rem !important;
		border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	}

	.mm-navbar .mm-brand-name {
		font-size: 1.2rem;
	}

	#hero {
		overflow-x: hidden;
	}

	.mm-hero .mm-hero-row {
		min-height: 0 !important;
		padding-top: var(--mm-nav-offset, var(--mm-nav-h)) !important;
		padding-bottom: 1.25rem;
	}

	.mm-hero-copy {
		max-width: 40rem;
		padding-bottom: 0.25rem;
	}

	.mm-display {
		font-size: clamp(2.1rem, 10vw, 3.05rem);
		line-height: 1.06;
	}

	.mm-hero-role {
		font-size: 0.78rem;
		letter-spacing: 0.05em;
		line-height: 1.5;
		max-width: 100%;
		hyphens: auto;
		-webkit-hyphens: auto;
	}

	.mm-lead {
		font-size: 0.98rem;
		line-height: 1.65;
		max-width: none;
	}

	.mm-quote {
		font-size: 1rem;
		line-height: 1.52;
		padding-left: 0.85rem;
		border-left-width: 2px;
	}

	.mm-hero-cta {
		flex-direction: column;
		flex-wrap: nowrap;
		align-items: stretch;
		gap: 0.5rem;
	}

	.mm-hero-cta .btn {
		width: 100%;
		margin-right: 0;
		margin-bottom: 0;
		text-align: center;
		padding-top: 0.8rem;
		padding-bottom: 0.8rem;
	}

	.mm-profile-shell {
		max-width: min(260px, 72vw);
		margin-left: auto;
		margin-right: auto;
	}

	.mm-profile-shell::before {
		width: 88px;
		height: 88px;
		inset: -8px -6px auto auto;
	}

	.mm-profile-caption-meta {
		font-size: 0.62rem;
		letter-spacing: 0.1em;
		line-height: 1.4;
	}

	.mm-hero-ledger {
		padding-top: 1.1rem;
		margin-top: 0;
		padding-bottom: 0.25rem;
	}

	.mm-hero-ledger-head {
		margin-bottom: 0.85rem;
	}

	.mm-credibility {
		margin-left: 0;
		margin-right: 0;
	}

	.mm-cred-item {
		padding: 0.35rem 0;
	}

	.mm-cred-tile {
		padding: 0.9rem 0.85rem 1rem;
	}

	.mm-cred-value {
		font-size: clamp(1.2rem, 4.5vw, 1.45rem);
	}

	.mm-cred-label {
		max-width: none;
		font-size: 0.62rem;
		line-height: 1.35;
	}

	.mm-section {
		padding: 3.25rem 0;
	}

	.mm-section-dark {
		padding: 3.25rem 0;
	}

	.mm-section-head {
		margin-bottom: 0.25rem;
	}

	.mm-heading {
		font-size: clamp(1.65rem, 6vw, 2.25rem);
	}

	.mm-subhead {
		font-size: 0.98rem;
		max-width: none;
	}

	.mm-impact-band {
		padding: 1.25rem 1.1rem 1.1rem;
	}

	.mm-impact-band-head {
		flex-direction: column;
		gap: 0.65rem;
		margin-bottom: 1.15rem;
		padding-bottom: 1rem;
	}

	.mm-impact-band-index {
		font-size: 1.25rem;
	}

	.mm-stat-card {
		min-height: 0;
		padding: 1.35rem 0.85rem;
	}

	.mm-stat-card--hero {
		min-height: 0;
		padding: 1.5rem 1rem;
	}

	.mm-stat-label {
		max-width: none;
	}

	.mm-outcome-strip {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.5rem;
	}

	.mm-timeline-item {
		padding-left: 2.35rem;
		margin-bottom: 1.5rem;
	}

	.mm-timeline::before {
		left: 7px;
	}

	.mm-timeline-marker {
		left: 0;
		top: 1.1rem;
	}

	.mm-card-pad {
		padding: 1.35rem 1.15rem;
	}

	.mm-case-body--featured {
		padding: 1.35rem 1.15rem;
	}

	.mm-contact-panel-main {
		padding: 1.5rem 1.05rem 1.65rem;
	}

	.mm-contact-photo,
	.mm-contact-photo-img {
		min-height: 200px;
	}

	.mm-contact-actions,
	.mm-contact-secondary {
		flex-direction: column;
		align-items: stretch;
	}

	.mm-contact-actions .mm-contact-action,
	.mm-contact-secondary .mm-contact-action {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
		text-align: center;
	}

	.mm-contact-primary {
		min-width: 0;
		order: -1;
	}

	a.back-to-top {
		right: max(12px, env(safe-area-inset-right));
		bottom: max(12px, env(safe-area-inset-bottom));
	}
}

@media (max-width: 575.98px) {
	#hero .mm-hero-container,
	#hero .container.mm-hero-container,
	main .container {
		padding-left: max(0.85rem, env(safe-area-inset-left));
		padding-right: max(0.85rem, env(safe-area-inset-right));
	}

	.mm-hero .mm-hero-row {
		padding-top: var(--mm-nav-offset, var(--mm-nav-h)) !important;
	}

	.mm-kicker {
		font-size: 0.65rem;
		letter-spacing: 0.16em;
		line-height: 1.5;
	}

	.mm-hero-ledger-head {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.35rem;
	}

	.mm-hero-ledger-kicker {
		font-size: 0.62rem;
		letter-spacing: 0.14em;
	}

	.mm-hero-ledger-note--short {
		font-size: 0.72rem;
		margin-top: 0;
	}

	.mm-role-tags {
		gap: 0.3rem;
	}

	.mm-pill-grid {
		gap: 0.4rem;
	}

	.mm-chips span {
		font-size: 0.78rem;
		padding: 0.32rem 0.7rem;
	}

	.mm-about-photo {
		max-width: min(320px, 90vw);
	}
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
	.mm-hero-blobs,
	.mm-blob,
	.mm-display,
	.mm-profile-frame,
	.mm-hero-ledger.mm-reveal-visible .mm-cred-item,
	.offcanvas-collapse.open .navbar-nav > .nav-item {
		animation: none !important;
	}

	.mm-hero-ledger .mm-cred-item {
		opacity: 1 !important;
		transform: none !important;
	}

	.mm-hero-bg {
		transform: none !important;
	}

	.mm-scroll-progress-bar {
		transition: none;
	}

	.mm-card-shine::after {
		display: none;
	}
}
