:root,
.mc-theme {
	--mc-navy: #040744;
	--mc-teal: #3eb0aa;
	--mc-teal-soft: #75c1b6;
	--mc-slate: #595d84;
	--mc-border: rgba(4, 7, 68, 0.12);
	--mc-bg: #f7f9fb;
	--mc-surface: #ffffff;
	--mc-text: #0b1220;
	--mc-muted: #5b6475;
	--mc-radius-md: 16px;
	--mc-radius-lg: 20px;
	--mc-radius-xl: 24px;
	--mc-shadow: 0 10px 30px rgba(16, 24, 40, 0.08);
	--mc-space-1: 8px;
	--mc-space-2: 12px;
	--mc-space-3: 16px;
	--mc-space-4: 24px;
	--mc-space-5: 32px;
	--mc-space-6: 48px;
	--mc-space-7: 64px;
	--mc-button-height: 48px;
	--mc-button-height-mobile: 44px;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

.mc-site-shell,
.mc-site-shell * {
	font-kerning: normal;
	font-synthesis: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.mc-site-shell img,
.mc-site-shell video,
.mc-site-shell svg,
.mc-site-shell canvas,
.mc-site-shell iframe {
	max-width: 100%;
	height: auto;
}

.mc-site-shell {
	text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}

.mc-site-shell,
.mc-shell,
.mcw-shell,
.mc-marketing-hero,
.mc-pricing-shell,
.mc-compare-shell,
.mc-faq-shell,
.mc-marketing-cta,
.mc-marketing-block,
.mc-marketing-proof,
.mc-upgrade-shell,
.mc-auth-shell {
	font-family: Inter, "Segoe UI", Arial, sans-serif;
	color: var(--mc-text);
}

.mc-button,
.mcw-shell .button,
.mc-portal .button,
.mc-wrap .button,
.mc-marketing-cta-row .button {
	min-height: var(--mc-button-height);
	padding: 0 18px;
	border-radius: 12px;
	font-weight: 700;
	line-height: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
}

.mc-button-primary,
.mcw-shell .button.button-primary,
.mc-portal .button.button-primary,
.mc-wrap .button.button-primary,
.mc-marketing-cta-row .button.button-primary {
	background: linear-gradient(120deg, var(--mc-teal) 0%, #2f8fca 100%);
	border: 1px solid color-mix(in srgb, var(--mc-teal) 70%, #0f4f78 30%);
	color: #fff;
}

.mc-button-secondary,
.mcw-shell .button,
.mc-portal .button:not(.button-primary),
.mc-wrap .button:not(.button-primary),
.mc-marketing-cta-row .button:not(.button-primary) {
	background: #fff;
	border: 1px solid var(--mc-border);
	color: var(--mc-navy);
}

.mc-component-hero {
	background: radial-gradient(circle at 84% -10%, rgba(62, 176, 170, 0.2) 0%, transparent 36%), linear-gradient(120deg, #f9fbff 0%, #eef3fb 100%);
	border: 1px solid var(--mc-border);
	border-radius: var(--mc-radius-xl);
	padding: clamp(20px, 3vw, 44px);
	box-shadow: var(--mc-shadow);
}

.mc-component-hero h1 {
	margin: 0;
	font-size: clamp(40px, 6vw, 64px);
	line-height: 1.02;
	letter-spacing: -1.1px;
	font-weight: 800;
}

.mc-component-hero .mc-lead {
	font-size: clamp(18px, 2.2vw, 20px);
	font-weight: 500;
	color: var(--mc-muted);
	margin-top: var(--mc-space-3);
}

.mc-stat-row {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
	gap: var(--mc-space-2);
}

.mc-stat-card {
	background: var(--mc-surface);
	border: 1px solid var(--mc-border);
	border-radius: var(--mc-radius-lg);
	padding: var(--mc-space-3);
	box-shadow: var(--mc-shadow);
}

.mc-stat-value {
	font-size: clamp(29px, 3vw, 42px);
	font-weight: 800;
	letter-spacing: -0.4px;
	margin: 6px 0;
}

.mc-feature-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: var(--mc-space-2);
}

.mc-feature-card {
	background: linear-gradient(130deg, #06112d 0%, #0f2650 100%);
	border: 1px solid rgba(117, 193, 182, 0.25);
	border-radius: var(--mc-radius-lg);
	padding: var(--mc-space-3);
	color: #eef6ff;
}

.mc-feature-card h3 {
	margin-top: 8px;
	margin-bottom: 8px;
	font-size: 22px;
}

.mc-feature-card p {
	margin: 0;
	color: #bdd0e8;
}

.mc-timeline {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: var(--mc-space-2);
}

.mc-timeline-step {
	background: #fff;
	border: 1px solid var(--mc-border);
	border-radius: var(--mc-radius-lg);
	padding: var(--mc-space-3);
	position: relative;
}

.mc-timeline-step .mc-step-index {
	width: 34px;
	height: 34px;
	border-radius: 999px;
	background: color-mix(in srgb, var(--mc-teal) 20%, #fff 80%);
	border: 1px solid color-mix(in srgb, var(--mc-teal) 35%, #fff 65%);
	color: var(--mc-navy);
	font-size: 13px;
	font-weight: 800;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.mc-accordion {
	display: grid;
	gap: var(--mc-space-2);
}

.mc-accordion details {
	border: 1px solid var(--mc-border);
	border-radius: 14px;
	background: #fff;
	overflow: hidden;
}

.mc-accordion summary {
	cursor: pointer;
	padding: 14px 16px;
	font-weight: 700;
}

.mc-accordion .mc-accordion-content {
	padding: 0 16px 14px;
	color: var(--mc-muted);
}

.mc-product-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: var(--mc-space-2);
}

.mc-product-card {
	border: 1px solid var(--mc-border);
	border-radius: var(--mc-radius-lg);
	background: #fff;
	padding: var(--mc-space-3);
	box-shadow: var(--mc-shadow);
}

.mc-trust-block {
	background: linear-gradient(120deg, #eaf8f7 0%, #f2f7fc 100%);
	border: 1px solid var(--mc-border);
	border-radius: var(--mc-radius-xl);
	padding: clamp(16px, 2vw, 28px);
}

.mc-table-pro,
.mc-table {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid var(--mc-border);
	border-radius: 14px;
	overflow: hidden;
	background: #fff;
}

.mc-table-pro th,
.mc-table-pro td,
.mc-table th,
.mc-table td {
	padding: 10px;
	border-bottom: 1px solid color-mix(in srgb, var(--mc-border) 80%, #fff 20%);
	text-align: left;
}

.mc-table-pro th,
.mc-table th {
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.4px;
	color: var(--mc-muted);
	background: #f4f7fb;
}

.mc-status-chip,
.mc-chip {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 5px 10px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	border: 1px solid transparent;
}

.mc-status-chip.pending,
.mc-chip--pending {
	background: #fff4df;
	border-color: #f6d59c;
	color: #9a5f00;
}

.mc-status-chip.paid,
.mc-status-chip.confirmed,
.mc-chip--paid,
.mc-chip--confirmed,
.mc-chip--active {
	background: #e3f7ec;
	border-color: #aadfc0;
	color: #0f6b3e;
}

.mc-status-chip.sent,
.mc-status-chip.approved,
.mc-chip--sent,
.mc-chip--approved {
	background: #ecf3ff;
	border-color: #c9daf9;
	color: #1f4da1;
}

.mc-status-chip.failed,
.mc-status-chip.rejected,
.mc-chip--failed,
.mc-chip--rejected {
	background: #ffe8e8;
	border-color: #f4bcbc;
	color: #9a2424;
}

.mc-toast {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 99999;
	padding: 12px 14px;
	border-radius: 12px;
	border: 1px solid var(--mc-border);
	background: #fff;
	box-shadow: var(--mc-shadow);
	color: var(--mc-navy);
	opacity: 0;
	transform: translateY(10px);
	pointer-events: none;
	transition: all 0.2s ease;
}

.mc-toast.is-visible {
	opacity: 1;
	transform: translateY(0);
}

.mc-empty-state,
.mc-empty {
	border: 1px dashed color-mix(in srgb, var(--mc-border) 80%, #fff 20%);
	border-radius: 14px;
	background: #fbfdff;
	color: var(--mc-muted);
	padding: 18px;
	text-align: center;
}

@media (max-width: 860px) {
	.mc-button,
	.mcw-shell .button,
	.mc-portal .button,
	.mc-wrap .button,
	.mc-marketing-cta-row .button {
		min-height: var(--mc-button-height-mobile);
	}
}