@import url("/public/assets/css/style.css");

:root {
  --mc-bg: #f6f8fb;
  --mc-surface: #ffffff;
  --mc-heading: #0f172a;
  --mc-text: #475569;
  --mc-muted: #64748b;
  --mc-border: #e2e8f0;
  --mc-accent: #f97316;
  --mc-accent-dark: #c2410c;
  --mc-navy: #07111f;
  --mc-radius: 18px;
  --mc-shadow: 0 18px 45px rgba(15, 23, 42, 0.10);
}

html,
body {
  background: var(--mc-bg);
  color: var(--mc-text);
}

h1,
h2,
h3,
h4 {
  color: var(--mc-heading);
}

p,
li {
  color: var(--mc-text);
}

a {
  color: #1d4ed8;
}

.btn,
button,
input[type="submit"],
input[type="button"],
.page-hero__cta {
  background: var(--mc-accent);
  color: #fff;
  border-radius: 12px;
  border: 1px solid transparent;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.12);
  transition: background-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.btn:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
.page-hero__cta:hover {
  background: var(--mc-accent-dark);
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.16);
}

.card,
.mini-card,
.check-card,
.verify-card,
.legal-card,
.agent-card {
  background: var(--mc-surface);
  border: 1px solid var(--mc-border);
  border-radius: var(--mc-radius);
  box-shadow: var(--mc-shadow);
}