/*
  Simple stylesheet for the Project Fionigan update demo.

  This file defines basic typography and layout rules to make the
  demonstration site readable and accessible. The colour palette
  provides sufficient contrast for accessibility without locking
  us into a particular brand aesthetic.
*/

html {
  box-sizing: border-box;
  font-size: 16px;
}

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

body {
  margin: 0;
  font-family: Arial, sans-serif;
  line-height: 1.6;
  background-color: #f9f9f9;
  color: #333;
}

header {
  background-color: #004080;
  color: #ffffff;
  padding: 1rem;
}

header h1 {
  margin: 0;
  font-size: 1.5rem;
}

nav ul {
  list-style: none;
  padding: 0;
  margin: 0.5rem 0 0;
  display: flex;
  gap: 1rem;
}

nav a {
  color: #ffffff;
  text-decoration: none;
}

nav a:hover,
nav a[aria-current="page"] {
  text-decoration: underline;
}

main {
  padding: 1rem;
}

footer {
  background-color: #004080;
  color: #ffffff;
  padding: 0.5rem;
  text-align: center;
  font-size: 0.8rem;
  position: sticky;
  bottom: 0;
}

h2 {
  color: #004080;
}

p {
  max-width: 70ch;
  margin-bottom: 1rem;
}