/* WPU Digital Design System - generated from tokens.json by scripts/build_design_tokens.py. Do not edit. */

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/learnx_wpu_website/static/src/fonts/inter/inter-latin-400-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/learnx_wpu_website/static/src/fonts/inter/inter-latin-500-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/learnx_wpu_website/static/src/fonts/inter/inter-latin-600-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/learnx_wpu_website/static/src/fonts/inter/inter-latin-700-normal.woff2") format("woff2");
}

:root {
  --primary-navy: #062e63;
  --primary-blue: #0b63e5;
  --deep-blue: #084b9a;
  --primary-blue-50: #eaf2fe;
  --accent-gold: #f5a900;
  --accent-gold-hover: #e09a00;
  --accent-gold-50: #fff6e0;
  --success: #12a67d;
  --success-text: #0b7a5b;
  --success-50: #e7f6f1;
  --warning: #f5a900;
  --warning-text: #8a5a00;
  --warning-50: #fff4d6;
  --error: #d92d20;
  --error-text: #b42318;
  --error-50: #fdecea;
  --info: var(--primary-blue);
  --info-50: var(--primary-blue-50);
  --bg-light: #f5f8fc;
  --surface-card: #ffffff;
  --surface-muted: #eef2f7;
  --border: #dce5ef;
  --border-input: #7a8ba3;
  --text-primary: #10213f;
  --text-secondary: #475467;
  --text-muted: #5b6b82;
  --text-disabled: #8a96a8;
  --text-on-dark: #ffffff;
  --text-on-dark-muted: #c9d6e8;
  --focus-ring: var(--primary-blue);
  --focus-ring-on-dark: var(--accent-gold);
  --overlay-hero: rgba(6, 46, 99, 0.82);
  --font-ui: Inter, "Segoe UI", Roboto, "Noto Sans", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 32px;
  --space-6: 48px;
  --space-7: 64px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-pill: 999px;
  --shadow-sm: 0 1px 2px rgba(16, 33, 63, 0.06);
  --shadow-md: 0 1px 2px rgba(16, 33, 63, 0.06), 0 8px 24px -12px rgba(16, 33, 63, 0.18);
  --shadow-lg: 0 24px 60px -24px rgba(6, 46, 99, 0.45);
  --touch-target: 44px;
  --control-height: 44px;
  --control-height-lg: 52px;
  --header-height: 72px;
  --sidebar-width: 264px;
  --content-max: 1240px;
  --measure: 68ch;
  --bp-mobile: 0px;
  --bp-tablet: 600px;
  --bp-desktop: 1024px;
  --bp-wide: 1440px;
}
.wpu-text-display { font-family: var(--font-ui); font-size: 56px; line-height: 60px; font-weight: 700; letter-spacing: -0.025em; }
.wpu-text-h1 { font-family: var(--font-ui); font-size: 36px; line-height: 44px; font-weight: 700; letter-spacing: -0.02em; }
.wpu-text-h2 { font-family: var(--font-ui); font-size: 28px; line-height: 36px; font-weight: 700; letter-spacing: -0.015em; }
.wpu-text-h3 { font-family: var(--font-ui); font-size: 22px; line-height: 30px; font-weight: 600; }
.wpu-text-h4 { font-family: var(--font-ui); font-size: 18px; line-height: 26px; font-weight: 600; }
.wpu-text-body { font-family: var(--font-ui); font-size: 16px; line-height: 24px; font-weight: 400; }
.wpu-text-body-small { font-family: var(--font-ui); font-size: 14px; line-height: 20px; font-weight: 400; }
.wpu-text-label { font-family: var(--font-ui); font-size: 14px; line-height: 20px; font-weight: 500; }
.wpu-text-caption { font-family: var(--font-ui); font-size: 12px; line-height: 16px; font-weight: 400; letter-spacing: 0.01em; }
.wpu-text-overline { font-family: var(--font-ui); font-size: 12px; line-height: 16px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }