@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,300&family=DM+Mono:wght@400;500&display=swap');

:root {
  --brand-blue: #102A60;
  --brand-blue-hover: #18366F;
  --brand-yellow: #FCD21C;
  --brand-red: #EF302B;
  --brand-accent: #2684FF;
  --bg:       #ffffff;
  --surface:  #F5F7FC;
  --border:   rgba(16, 42, 96, 0.1);
  --text:     #18233F;
  --muted:    #53617B;
  --faint:    #65718A;
  --accent:   var(--brand-blue);
  --accent2:  #0756AD;
  --accent-light: #E3F2FF;
  --danger:   #e53e3e;
  --success:  #38a169;
  --mono:     'DM Mono', monospace;
  --sans:     'DM Sans', system-ui, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

body {
  font-family: var(--sans);
  font-size: 17px;
  background: var(--bg);
  color: var(--text);
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}


:focus-visible { outline: 3px solid var(--accent2); outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* ── Global ── */
a { color: var(--accent2); text-decoration: none; }
a:hover { text-decoration: underline; }
strong { color: var(--text); font-weight: 600; }