:root {
  --red: #c8102e;
  --red-hover: #a90d27;
  --red-deep: #8b1524;
  --red-ink: #6e101c;
  --red-soft: #fbe9ec;
  --red-tint: #f3d6db;
  --header: #8a1422;
  --navy: #1b365d;
  --navy-soft: #e6ecf5;
  --banner: #e35a00;

  --n0: #fff;
  --n50: #f7f9fa;
  --n100: #eef2f5;
  --n200: #d5dde3;
  --n300: #b7c2cb;
  --n400: #8b969f;
  --n500: #66707a;
  --n600: #4b5660;
  --n700: #3d4a54;
  --n800: #2a3238;
  --n900: #1c2126;

  --anthracite: #3d4a54;
  --ink: #1c2126;
  --muted: #66707a;
  --line: #d5dde3;
  --paper: #eef2f5;
  --admin-bg: #f3f5f7;
  --card: #fff;

  --ok: #166534;
  --ok-bg: #e7f6ee;
  --ok-line: #bfe3cd;
  --warn: #7c2d12;
  --warn-bg: #fff4e5;
  --warn-line: #f6d4a8;
  --bad: #7a1c16;
  --bad-bg: #fdecea;
  --bad-line: #f4b9b4;
  --info: #173b66;
  --info-bg: #e8f0fa;
  --info-line: #bcd0ea;

  --sans: "Plus Jakarta Sans", "Segoe UI", Tahoma, sans-serif;
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-base: 14.5px;
  --fs-md: 16px;
  --fs-lg: 18px;
  --fs-xl: 22px;
  --fs-2xl: 28px;
  --fs-3xl: clamp(30px, 3.6vw, 42px);

  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-10: 40px;
  --sp-12: 48px;

  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-xl: 20px;
  --r-pill: 999px;
  --radius: 10px;

  --sh-1: 0 1px 2px rgba(28, 33, 38, .06);
  --sh-2: 0 4px 14px rgba(28, 33, 38, .08);
  --sh-3: 0 16px 40px rgba(28, 33, 38, .12);
  --shadow: 0 10px 30px rgba(28, 33, 38, .08);
  --ring: 0 0 0 3px rgba(200, 16, 46, .22);

  --max: 1380px;
  --header-h: 64px;
  --side-w: 248px;
  --topbar-h: 56px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--sans);
  font-weight: 400;
  font-size: var(--fs-base);
  color: var(--ink);
  background: var(--paper);
  min-height: 100vh;
  line-height: 1.5;
  overflow-x: clip;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3, h4, p { margin: 0; }
h1, h2, h3, h4 { line-height: 1.2; letter-spacing: -.02em; }
:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; }
::selection { background: var(--red-tint); }
[hidden] { display: none !important; }

.wrap { width: min(var(--max), calc(100% - 32px)); margin-inline: auto; }

.eyebrow {
  font-size: var(--fs-xs);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--n500);
  font-weight: 700;
}
.help { color: var(--n500); font-size: 12.5px; font-weight: 400; line-height: 1.45; }
.text-muted { color: var(--n500); }
.sr-only {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.mt-2 { margin-top: var(--sp-2); }
.mt-3 { margin-top: var(--sp-3); }
.mt-4 { margin-top: var(--sp-4); }
.mb-3 { margin-bottom: var(--sp-3); }
.mb-4 { margin-bottom: var(--sp-4); }
.stack { display: grid; gap: var(--sp-3); }
.row { display: flex; flex-wrap: wrap; gap: var(--sp-3); align-items: flex-start; }
.row > * { flex: 1 1 200px; min-width: 0; }
.max-sm { max-width: 420px; }
.max-md { max-width: 560px; }
.max-lg { max-width: 760px; }
.nowrap { white-space: nowrap; }
.t-right { text-align: right; }
.flex { display: flex; gap: var(--sp-2); flex-wrap: wrap; align-items: center; }