/* -----------------------------------------------------------
  Variables
-------------------------------------------------------------- */
:root {
  /* Colour definitions: */
  --deep-red: #261000;
  --red-1: #ce2135;
  --red-2: #ef3a4d;
  --red-3: #880805;
  --red-tint: #fdf6f2;
  --red-faint: #fefaf9;
  --deep-green: #112300;
  --green-1: #6b7d27;
  --green-2: #7f8e2f;
  --green-tint: color-mix(in sRGB, var(--green-2) 10%, white 90%);
  --deep-blue: #000b39;
  --blue-1: #1b7ab0;
  --blue-2: #1c83bd;
  --blue-tint: color-mix(in sRGB, var(--blue-2) 10%, white 90%);
  --sand: #a18f82;
  --beige: #ebe5d9;
  --neutrals-100: #e7e7e7;
  --neutrals-200: #cecece;
  --neutrals-300: #b6b6b6;
  --neutrals-400: #929292;
  --neutrals-600: #6d6d6d;
  --neutrals-700: #414141;
  --neutrals-800: #262626;
  --neutrals-900: #1b1b1b;
  --awm-key: #231f20;
  /* Colour usage */
  --k: var(--awm-key);
  --l: white;
  --brand-primary: var(--red-1);
  --brand-primary-focus: var(--red-3);
  /* Maximum widths  */
  --layout-max-width: 84rem;
  --layout-width: min(100% - 2rem, var(--layout-max-width));
  --content-max-width: 62rem;
  --content-width: min(100% - 2rem, var(--content-max-width));
}

/* -----------------------------------------------------------
  Typography
-------------------------------------------------------------- */
body {
  line-height: 1.7;
}
body,
button,
input,
select,
textarea {
  color: var(--k);
}
/* Headings */
h1,
.h1 {
  color: var(--brand-primary);
  font-family: "Gothic A1", sans-serif;
  font-size: clamp(2rem, 4vw, 4rem);
  font-weight: 900;
  letter-spacing: 0.125rem;
  line-height: 1.2;
  text-transform: uppercase;
  transform: scale(0.9, 1);
  transform-origin: top left;
}
h2,
.h2 {
  font-family: "Gothic A1", sans-serif;
  font-size: clamp(1.8rem, 3vw, 3rem);
  font-weight: 900;
  letter-spacing: 0.125rem;
  line-height: 1.4;
  margin-top: 3rem;
  transform: scale(0.9, 1);
  transform-origin: top left;
}
h3,
.h3 {
  color: var(--brand-primary);
  font-family: "Gothic A1", sans-serif;
  font-size: clamp(1.6rem, 2.5vw, 2.6rem);
  font-weight: 500;
  line-height: 1.4;
  margin-top: 3rem;
  transform: scale(0.9, 1);
  transform-origin: top left;
}
h4,
.h4 {
  font-family: "Gothic A1", sans-serif;
  font-size: clamp(1.3rem, 2vw, 2.2rem);
  font-weight: 700;
  line-height: 1.4;
  margin-top: 3rem;
  transform: scale(0.9, 1);
  transform-origin: top left;
}
h5,
.h5,
h6,
.h6 {
  font-family: "Gothic A1", sans-serif;
  font-size: clamp(1.2rem, 2vw, 2rem);
  font-weight: 500;
  line-height: 1.4;
  margin-top: 3rem;
  transform: scale(0.9, 1);
  transform-origin: top left;
}
/* Links */
a {
  color: var(--brand-primary);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.25rem;
}
a:visited {
  color: var(--neutrals-700);
}
a:hover,
a:focus {
  color: var(--brand-primary-focus);
  text-decoration-color: var(--brand-primary-focus);
  text-decoration-thickness: 2px;
}
/* Lists */
#content ul,
#content ol {
  margin-left: 2rem;
}
#content li {
  margin: 0.25rem 0;
}
/* Definition list */
dl {
  margin: 1.5rem 0 1.5rem 0;
}
dt {
  font-weight: 600;
}
dd {
  border-bottom: 1px solid black;
  padding-left: 2rem;
}
/* Tables */
#content table {
  border: none;
  border-bottom: 1px solid var(--red-3);
  border-collapse: collapse;
  margin: 1.5rem 0;
  width: 100%;
}
#content caption {
  font-weight: 500;
  padding: 0.5rem;
  text-align: left;
}
#content th {
  border-bottom: 1px solid var(--red-3);
  font-weight: 500;
  padding: 0.5rem;
  text-align: left;
  vertical-align: top;
}
#content thead th {
  background-color: var(--red-3);
  border-bottom: 1px solid var(--red-3);
  color: var(--l);
}
#content td {
  border-bottom: 1px solid var(--red-3);
  padding: 0.5rem;
  vertical-align: top;
}
#content tfoot td,
#content tfoot td {
  background-color: var(--red-3);
  color: var(--l);
  font-weight: 500;
}
/* Messages */
.messages {
  margin: 1rem 0;
}
/* Misc */
iframe {
  z-index: 1;
}
hr {
  background-color: var(--brand-primary);
  border: none;
  color: var(--brand-primary);
  height: 1px;
  margin: 2rem 0;
}
form legend {
  margin-bottom: 0;
}
p.intro {
  font-size: 1.125rem;
  font-weight: 600;
}
.left,
.alignleft,
.align-left {
  float: left;
  margin-bottom: 1.5rem;
  margin-right: 1.5rem;
}
.right,
.alignright,
.align-right {
  float: right;
  margin-bottom: 1.5rem;
  margin-left: 1.5rem;
}
.align-left + .align-right {
  margin-left: 0;
}
.align-left + .align-right + * {
  clear: both;
}
.fix-origin {
  transform-origin: initial;
}

/* -----------------------------------------------------------
  View Transitions
  https://developer.mozilla.org/en-US/docs/Web/CSS/@view-transition
  No universally supported, but getting pretty close
-------------------------------------------------------------- */
@media (prefers-reduced-motion: no-preference) {
  /* stylelint-disable-next-line selector-pseudo-element-no-unknown */
  ::view-transition-new(root) {
    animation-duration: 0.5s;
  }
  /* stylelint-disable-next-line selector-pseudo-element-no-unknown */
  ::view-transition-old(root) {
    animation-duration: 0.5s;
  }
  /* stylelint-disable-next-line at-rule-no-unknown */
  @view-transition {
    navigation: auto;
  }
}