@font-face {
  font-family: "Fa Solid 900";
  src: url('../fonts/fa-solid-900.woff2') format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fa Sharp Duotone 300";
  src: url('../fonts/fa-sharp-duotone-light-300.woff2') format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fa 300";
  src: url('../fonts/fa-light-300.woff2') format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fa 100";
  src: url('../fonts/fa-thin-100.woff2') format("woff2");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fa Duotone 400";
  src: url('../fonts/fa-duotone-regular-400.woff2') format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fa Sharp Solid 900";
  src: url('../fonts/fa-sharp-solid-900.woff2') format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fa Sharp 400";
  src: url('../fonts/fa-sharp-regular-400.woff2') format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fa Sharp 100";
  src: url('../fonts/fa-sharp-thin-100.woff2') format("woff2");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fa Sharp Duotone Solid 900";
  src: url('../fonts/fa-sharp-duotone-solid-900.woff2') format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fa Sharp Duotone 400";
  src: url('../fonts/fa-sharp-duotone-regular-400.woff2') format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fa Brands 400";
  src: url('../fonts/fa-brands-400.woff2') format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fa Sharp 300";
  src: url('../fonts/fa-sharp-light-300.woff2') format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fa 400";
  src: url('../fonts/fa-regular-400.woff2') format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fa Duotone 900";
  src: url('../fonts/fa-duotone-900.woff2') format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fa V 4 Compatibility";
  src: url('../fonts/fa-v4compatibility.woff2') format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fa Sharp Duotone 100";
  src: url('../fonts/fa-sharp-duotone-thin-100.woff2') format("woff2");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fa Duotone 100";
  src: url('../fonts/fa-duotone-thin-100.woff2') format("woff2");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fa Duotone 300";
  src: url('../fonts/fa-duotone-light-300.woff2') format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Figtree Variablefont Wght;
  src: url('../fonts/Figtree-Italic-VariableFont_wght.ttf') format("truetype");
  font-weight: 300 900;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Figtree Variablefont Wght;
  src: url('../fonts/Figtree-VariableFont_wght.ttf') format("truetype");
  font-weight: 300 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --_typography---fonts--primary-font: "Figtree Variablefont Wght", Arial, sans-serif;
  --_colour-modes---typography--body-colour: #626c75;
  --_responsive---font-size--body: 1rem;
  --_typography---body--line-height: 1.5;
  --_typography---body--font-weight: 400;
  --_typography---body--letter-spacing: -.01em;
  --_typography---h1--bottom-margin: var(--spacing--tiny);
  --_typography---h1--font-family: var(--_typography---fonts--heading-font);
  --_colour-modes---typography--heading-colour: #323a41;
  --_responsive---font-size--h1: 4.25rem;
  --_typography---h1--line-height: 1.1;
  --_typography---h1--font-weight: 500;
  --_typography---h1--letter-spacing: -.03em;
  --_typography---h2--bottom-margin: var(--spacing--tiny);
  --_typography---h2--font-family: var(--_typography---fonts--heading-font);
  --_responsive---font-size--h2: 3.25rem;
  --_typography---h2--line-height: 1.2;
  --_typography---h2--font-weight: 500;
  --_typography---h2--letter-spacing: -.03em;
  --_typography---h3--bottom-margin: var(--spacing--tiny);
  --_typography---h3--font-family: var(--_typography---fonts--heading-font);
  --_responsive---font-size--h3: 2.5rem;
  --_typography---h3--line-height: 1.2;
  --_typography---h3--font-weight: 400;
  --_typography---h3--letter-spacing: -.03em;
  --_typography---h4--bottom-margin: var(--spacing--tiny);
  --_typography---h4--font-family: var(--_typography---fonts--heading-font);
  --_responsive---font-size--h4: 1.75rem;
  --_typography---h4--line-height: 1.4;
  --_typography---h4--font-weight: 400;
  --_typography---h4--letter-spacing: -.02em;
  --_typography---h5--bottom-margin: var(--spacing--tiny);
  --_typography---h5--font-family: var(--_typography---fonts--heading-font);
  --_responsive---font-size--h5: 1.2rem;
  --_typography---h5--line-height: 1.4;
  --_typography---h5--font-weight: 400;
  --_typography---h5--letter-spacing: -.02em;
  --_typography---h6--bottom-margin: var(--spacing--tiny);
  --_typography---h6--font-family: var(--_typography---fonts--heading-font);
  --_responsive---font-size--h6: 1rem;
  --_typography---h6--line-height: 1.4;
  --_typography---h6--font-weight: 400;
  --_typography---h6--letter-spacing: -.02em;
  --spacing--small: 1rem;
  --spacing--medium: 2rem;
  --_colours---primary--colour-1: #f3a51e;
  --border-radius--medium: .5rem;
  --_colours---neutrals--white: white;
  --_colours---secondary--colour-2: #e34c25;
  --_colours---neutrals--light-grey: #f7f7f7;
  --_colours---neutrals--mid-grey: #e1e1e1;
  --misc--underline-offset\<deleted\|variable-9a68fa2b-939e-3931-4504-e106e31162ea\>: .15em;
  --spacing--xtra-large: 6.25rem;
  --spacing--large: 3.25rem;
  --_colours---elements--light-bg: var(--_colours---neutrals--light-grey);
  --_colours---elements--dark-bg: var(--_colours---secondary--colour-2);
  --content-wrapper--regular: 75rem;
  --content-wrapper--wide: 94rem;
  --content-wrapper--narrow: 60rem;
  --_colours---elements--dark-overlay: #00000080;
  --_colours---elements--border: var(--_colours---neutrals--mid-grey);
  --spacing--tiny: .25rem;
  --_colours---neutrals--black: #1a1a1a;
  --_responsive---font-size--text-small: .875rem;
  --border-radius--small: .25rem;
  --border-radius--tiny\<deleted\|variable-5eac1b79-59fc-acac-ae88-d8635e725644\>: .125rem;
  --spacing--x-small: .5rem;
  --_responsive---font-size--text-large: 1.15rem;
  --_colours---secondary--colour-3: #88cfff;
  --_colours---neutrals--dark-grey: #5f5f5f;
  --_colours---secondary--colour-4: #f7f7f7;
  --_colours---secondary--colour-5: #f7f7f7;
  --_typography---fonts--heading-font: "Figtree Variablefont Wght", Arial, sans-serif;
  --border-radius--large: 1rem;
  --_colours---elements--border-on-dark: #5d7da8;
}

.w-layout-grid {
  grid-row-gap: 16px;
  grid-column-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

body {
  font-family: var(--_typography---fonts--primary-font);
  color: var(--_colour-modes---typography--body-colour);
  font-size: var(--_responsive---font-size--body);
  line-height: var(--_typography---body--line-height);
  font-weight: var(--_typography---body--font-weight);
  letter-spacing: var(--_typography---body--letter-spacing);
}

h1 {
  margin-top: 0;
  margin-bottom: var(--_typography---h1--bottom-margin);
  font-family: var(--_typography---h1--font-family);
  color: var(--_colour-modes---typography--heading-colour);
  font-size: var(--_responsive---font-size--h1);
  line-height: var(--_typography---h1--line-height);
  font-weight: var(--_typography---h1--font-weight);
  letter-spacing: var(--_typography---h1--letter-spacing);
}

h2 {
  margin-top: 0;
  margin-bottom: var(--_typography---h2--bottom-margin);
  font-family: var(--_typography---h2--font-family);
  color: var(--_colour-modes---typography--heading-colour);
  font-size: var(--_responsive---font-size--h2);
  line-height: var(--_typography---h2--line-height);
  font-weight: var(--_typography---h2--font-weight);
  letter-spacing: var(--_typography---h2--letter-spacing);
}

h3 {
  margin-top: 0;
  margin-bottom: var(--_typography---h3--bottom-margin);
  font-family: var(--_typography---h3--font-family);
  color: var(--_colour-modes---typography--heading-colour);
  font-size: var(--_responsive---font-size--h3);
  line-height: var(--_typography---h3--line-height);
  font-weight: var(--_typography---h3--font-weight);
  letter-spacing: var(--_typography---h3--letter-spacing);
}

h4 {
  margin-top: 0;
  margin-bottom: var(--_typography---h4--bottom-margin);
  font-family: var(--_typography---h4--font-family);
  color: var(--_colour-modes---typography--heading-colour);
  font-size: var(--_responsive---font-size--h4);
  line-height: var(--_typography---h4--line-height);
  font-weight: var(--_typography---h4--font-weight);
  letter-spacing: var(--_typography---h4--letter-spacing);
}

h5 {
  margin-top: 0;
  margin-bottom: var(--_typography---h5--bottom-margin);
  font-family: var(--_typography---h5--font-family);
  color: var(--_colour-modes---typography--heading-colour);
  font-size: var(--_responsive---font-size--h5);
  line-height: var(--_typography---h5--line-height);
  font-weight: var(--_typography---h5--font-weight);
  letter-spacing: var(--_typography---h5--letter-spacing);
}

h6 {
  margin-top: 0;
  margin-bottom: var(--_typography---h6--bottom-margin);
  font-family: var(--_typography---h6--font-family);
  color: var(--_colour-modes---typography--heading-colour);
  font-size: var(--_responsive---font-size--h6);
  line-height: var(--_typography---h6--line-height);
  font-weight: var(--_typography---h6--font-weight);
  letter-spacing: var(--_typography---h6--letter-spacing);
}

p {
  margin-bottom: 10px;
}

a {
  color: inherit;
  -webkit-text-decoration: inherit;
  text-decoration: inherit;
}

ul, ol {
  margin-top: var(--spacing--small);
  margin-bottom: var(--spacing--small);
  padding-left: var(--spacing--medium);
}

li {
  margin-bottom: .5em;
}

img {
  max-width: 100%;
  display: inline-block;
}

blockquote {
  background-image: url('../images/right-quotation-sign.svg');
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 22px;
  border-left: 5px #e2e2e2;
  margin-bottom: 10px;
  padding: 10px 20px 10px 32px;
  font-size: 1.1rem;
  line-height: 22px;
}

figure {
  margin-bottom: 10px;
}

.style-guide-section {
  grid-column-gap: var(--spacing--small);
  grid-row-gap: var(--spacing--small);
  flex-direction: column;
  display: flex;
}

.btn-primary {
  grid-column-gap: .5em;
  grid-row-gap: .5em;
  border: 1px solid var(--_colours---primary--colour-1);
  border-radius: var(--border-radius--medium);
  background-color: var(--_colours---primary--colour-1);
  color: var(--_colours---neutrals--white);
  text-align: center;
  justify-content: center;
  align-items: center;
  padding: 1rem 2.4rem;
  line-height: 1.2;
  transition: all .35s;
  display: inline-flex;
}

.btn-primary:where(.w-variant-d90dcd72-7eda-3f73-8142-7cf745f20969) {
  border-color: var(--_colours---secondary--colour-2);
  background-color: var(--_colours---secondary--colour-2);
  color: var(--_colours---neutrals--white);
}

.btn-primary:where(.w-variant-683b7570-7b2f-de61-055d-2f4b6202f1b8) {
  border-color: var(--_colours---neutrals--light-grey);
  background-color: var(--_colours---neutrals--light-grey);
  color: var(--_colours---primary--colour-1);
}

.btn-primary:where(.w-variant-788e57b4-891e-c459-3640-d12834831484) {
  border-color: var(--_colours---neutrals--light-grey);
  background-color: #f7f7f700;
}

.btn-primary:hover {
  border-color: var(--_colours---secondary--colour-2);
  background-color: var(--_colours---secondary--colour-2);
}

.btn-primary:hover:where(.w-variant-d90dcd72-7eda-3f73-8142-7cf745f20969) {
  border-color: var(--_colours---primary--colour-1);
  background-color: var(--_colours---primary--colour-1);
  color: var(--_colours---neutrals--white);
}

.btn-primary:hover:where(.w-variant-683b7570-7b2f-de61-055d-2f4b6202f1b8) {
  border-color: var(--_colours---neutrals--light-grey);
  background-color: var(--_colours---neutrals--mid-grey);
  color: var(--_colours---secondary--colour-2);
}

.btn-primary:hover:where(.w-variant-788e57b4-891e-c459-3640-d12834831484) {
  background-color: var(--_colours---neutrals--light-grey);
  color: var(--_colours---secondary--colour-2);
}

.rich-text a {
  color: var(--_colours---primary--colour-1);
  text-underline-offset: var(--misc--underline-offset\<deleted\|variable-9a68fa2b-939e-3931-4504-e106e31162ea\>);
  font-weight: 600;
  text-decoration: underline;
}

.rich-text a:hover {
  text-decoration: underline;
}

.rich-text p {
  margin-bottom: var(--spacing--small);
}

.section {
  padding: var(--spacing--xtra-large) var(--spacing--large);
  color: var(--_colour-modes---typography--body-colour);
}

.section.is-ip-header {
  color: #fff;
  --_colour-modes---typography--body-colour: #e3ebf2;
  --_colour-modes---typography--heading-colour: var(--_colours---neutrals--white);
  padding-top: 11rem;
  position: relative;
}

.section.is-grey {
  background-color: var(--_colours---elements--light-bg);
}

.section.is-dark {
  background-color: var(--_colours---elements--dark-bg);
  --_colour-modes---typography--body-colour: #e3ebf2;
  --_colour-modes---typography--heading-colour: var(--_colours---neutrals--white);
}

.section.is-hero {
  color: #fff;
  --_colour-modes---typography--body-colour: #e3ebf2;
  --_colour-modes---typography--heading-colour: var(--_colours---neutrals--white);
  flex-flow: column;
  justify-content: center;
  align-items: stretch;
  min-height: 100svh;
  padding-top: 10rem;
  padding-bottom: 10rem;
  display: flex;
  position: relative;
}

.large-marg-top {
  margin-top: var(--spacing--large);
}

.medium-marg-top {
  margin-top: var(--spacing--medium);
}

.small-marg-top {
  margin-top: var(--spacing--small);
}

.large-marg-bottom {
  margin-bottom: var(--spacing--large);
}

.centre {
  text-align: center;
}

.project-content {
  position: relative;
  overflow: clip;
}

.utility-page-wrap {
  justify-content: center;
  align-items: center;
  width: 100vw;
  max-width: 100%;
  height: 100vh;
  max-height: 100%;
  padding: 100px 20px;
  display: flex;
}

.utility-page-content {
  text-align: center;
  flex-direction: column;
  align-items: center;
  width: 50%;
  display: flex;
}

.utility-page-form {
  flex-direction: column;
  align-items: stretch;
  display: flex;
}

._404-logo {
  margin-right: auto;
  margin-bottom: var(--spacing--small);
  max-width: 5rem;
  margin-left: auto;
  display: block;
}

.content-wrapper {
  max-width: var(--content-wrapper--regular);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.content-wrapper.is-narrow {
  max-width: var(--content-wrapper--narrow);
}

.style-guide-icons {
  grid-column-gap: var(--spacing--small);
  flex-wrap: wrap;
  align-items: center;
  display: flex;
}

.fa-icon {
  justify-content: center;
  align-items: center;
  font-family: "Fa solid 900", Arial, sans-serif;
}

.fa-icon.brand {
  font-family: "Fa brands 400", Arial, sans-serif;
}

.fa-icon.padlock {
  font-size: 3rem;
}

.fa-icon.is-inline {
  font-size: .9em;
}

.fa-icon.is-light {
  font-family: "Fa 400", Arial, sans-serif;
}

.fa-icon.is-right {
  padding-left: .25em;
  font-size: .9em;
}

.fa-icon.is-left {
  padding-right: .25em;
  font-size: .9em;
}

.fa-icon.is-colour-1 {
  color: var(--_colours---primary--colour-1);
}

.bg-wash {
  background-color: var(--_colours---elements--dark-overlay);
  pointer-events: none;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
}

.h1 {
  margin-top: 0;
  margin-bottom: var(--_typography---h1--bottom-margin);
  font-family: var(--_typography---h1--font-family);
  color: var(--_colour-modes---typography--heading-colour);
  font-size: var(--_responsive---font-size--h1);
  line-height: var(--_typography---h1--line-height);
  font-weight: var(--_typography---h1--font-weight);
  letter-spacing: var(--_typography---h1--letter-spacing);
}

.h1.is-hero {
  font-size: 3.4rem;
}

.h2 {
  margin-top: 0;
  margin-bottom: var(--_typography---h2--bottom-margin);
  font-family: var(--_typography---h2--font-family);
  color: var(--_colour-modes---typography--heading-colour);
  font-size: var(--_responsive---font-size--h2);
  line-height: var(--_typography---h2--line-height);
  font-weight: var(--_typography---h2--font-weight);
  letter-spacing: var(--_typography---h2--letter-spacing);
}

.h3 {
  margin-top: 0;
  margin-bottom: var(--_typography---h3--bottom-margin);
  font-family: var(--_typography---h3--font-family);
  color: var(--_colour-modes---typography--heading-colour);
  font-size: var(--_responsive---font-size--h3);
  line-height: var(--_typography---h3--line-height);
  font-weight: var(--_typography---h3--font-weight);
  letter-spacing: var(--_typography---h3--letter-spacing);
}

.h4 {
  margin-top: 0;
  margin-bottom: var(--_typography---h4--bottom-margin);
  font-family: var(--_typography---h4--font-family);
  color: var(--_colour-modes---typography--heading-colour);
  font-size: var(--_responsive---font-size--h4);
  line-height: var(--_typography---h4--line-height);
  font-weight: var(--_typography---h4--font-weight);
  letter-spacing: var(--_typography---h4--letter-spacing);
}

.h5 {
  margin-top: 0;
  margin-bottom: var(--_typography---h5--bottom-margin);
  font-family: var(--_typography---h5--font-family);
  color: var(--_colour-modes---typography--heading-colour);
  font-size: var(--_responsive---font-size--h5);
  line-height: var(--_typography---h5--line-height);
  font-weight: var(--_typography---h5--font-weight);
  letter-spacing: var(--_typography---h5--letter-spacing);
}

.h6 {
  margin-top: 0;
  margin-bottom: var(--_typography---h6--bottom-margin);
  font-family: var(--_typography---h6--font-family);
  color: var(--_colour-modes---typography--heading-colour);
  font-size: var(--_responsive---font-size--h6);
  line-height: var(--_typography---h6--line-height);
  font-weight: var(--_typography---h6--font-weight);
  letter-spacing: var(--_typography---h6--letter-spacing);
}

.style-guide-section-card {
  max-width: var(--content-wrapper--regular);
  padding: var(--spacing--large);
  grid-column-gap: var(--spacing--large);
  grid-row-gap: var(--spacing--large);
  border: 1px solid var(--_colours---elements--border);
  border-radius: var(--border-radius--medium);
  background-color: var(--_colours---neutrals--white);
  flex-flow: column;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  position: relative;
}

.style-body {
  padding: var(--spacing--xtra-large) var(--spacing--medium) var(--spacing--medium);
  grid-column-gap: var(--spacing--small);
  grid-row-gap: var(--spacing--small);
  background-color: var(--_colours---elements--light-bg);
  flex-flow: column;
  justify-content: flex-start;
  align-items: stretch;
  display: flex;
}

.nav-right {
  grid-column-gap: var(--spacing--small);
  grid-row-gap: var(--spacing--small);
  flex: none;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.nav-menu {
  text-align: right;
  flex: none;
  justify-content: flex-end;
  align-self: center;
  align-items: center;
  display: flex;
  position: static;
}

.nav-section {
  z-index: 1001;
  margin-top: var(--spacing--medium);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
}

.dropdown-toggle {
  margin-left: 0;
  margin-right: 0;
  display: none;
}

.logo-image.is-mark {
  opacity: 0;
  position: absolute;
  inset: 0% auto 0% 0%;
}

.navbar {
  padding: var(--spacing--small) var(--spacing--large);
  color: var(--_colour-modes---typography--heading-colour);
  background-color: #0000;
  justify-content: space-between;
  align-items: center;
  position: relative;
}

.navbar:where(.w-variant-409cd44e-69b9-93ab-2ed2-bc7dc7c0b190) {
  color: var(--_colours---neutrals--white);
}

.dd-icon {
  margin-left: 4px;
  margin-right: 0;
  font-size: 14px;
  position: static;
}

.navlink {
  padding: var(--spacing--small);
  color: var(--_colours---neutrals--white);
  margin-left: 0;
  margin-right: 0;
  font-weight: 600;
  transition: color .35s;
}

.navlink:hover {
  color: #bfbfbf;
}

.navlink.w--current {
  color: var(--_colours---neutrals--white);
}

.navlink.dropdown {
  flex-direction: row;
  justify-content: flex-start;
  display: flex;
}

.navlink.extra {
  font-size: var(--_responsive---font-size--text-small);
}

.nav-left {
  grid-column-gap: var(--spacing--small);
  grid-row-gap: var(--spacing--small);
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.nav-flex {
  z-index: 10;
  max-width: var(--content-wrapper--regular);
  justify-content: center;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  position: relative;
}

.logo {
  order: -1;
  transition: all .35s;
}

.logo:hover {
  opacity: .7;
}

.dropdown-list.w--open {
  padding: var(--spacing--small);
  border-radius: var(--border-radius--small);
  background-color: #fff;
  flex-direction: column;
  min-width: 360px;
  display: flex;
  top: 88px;
  box-shadow: 0 20px 60px #0000001a;
}

.social-link {
  border-radius: var(--border-radius--tiny\<deleted\|variable-5eac1b79-59fc-acac-ae88-d8635e725644\>);
  color: #fff;
  background-color: #ffffff1a;
  justify-content: center;
  align-items: center;
  width: 2.5rem;
  height: 2.5rem;
  font-family: "Fa brands 400", Arial, sans-serif;
  text-decoration: none;
  transition: all .35s;
  display: flex;
}

.social-link:hover {
  color: #23425a;
  background-color: #fff;
}

.socials-wrapper {
  grid-column-gap: .75rem;
  grid-row-gap: .75rem;
  flex-direction: column;
  align-items: flex-end;
  display: flex;
}

.footer-logo {
  max-width: 5rem;
}

.footer-title {
  margin-bottom: var(--spacing--x-small);
  color: #fff;
  letter-spacing: -.5px;
  font-size: 1rem;
  font-weight: 700;
}

.footer-link {
  padding-top: var(--spacing--x-small);
  padding-bottom: var(--spacing--x-small);
  color: #fff9;
  font-weight: 400;
  text-decoration: none;
  transition: all .35s;
  display: block;
}

.footer-link:hover {
  color: #fff;
}

.fd-link-hover {
  margin-left: .5rem;
  transition: all .35s;
  display: flex;
}

.fd-link-hover:hover {
  transform: translate(0, -5px);
}

.copyright-grid {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  border-top: 1px solid #ffffff1a;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  margin-top: 3rem;
  padding-top: 2rem;
  font-size: .9rem;
  display: grid;
}

.website-credit {
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.footer {
  padding: var(--spacing--xtra-large) var(--spacing--large) var(--spacing--medium);
  color: #fff9;
  background-color: #0d171d;
  font-size: .9rem;
}

.footer-column {
  grid-column-gap: var(--spacing--medium);
  grid-row-gap: var(--spacing--medium);
  flex-direction: column;
  align-items: flex-start;
  display: flex;
}

.footer-grid {
  grid-column-gap: 3rem;
  grid-row-gap: 2rem;
  grid-template-rows: auto;
  grid-template-columns: .75fr 1fr 1.25fr 1fr .25fr;
}

.hero-image {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
}

.button-row {
  margin-top: var(--spacing--medium);
  grid-column-gap: var(--spacing--small);
  grid-row-gap: var(--spacing--small);
  flex-flow: wrap;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.button-row.no-margin {
  margin-top: 0;
}

.button-row.is-centred {
  justify-content: center;
  align-items: center;
}

.button-row.in-hero {
  justify-content: flex-end;
  align-items: center;
  margin-top: 0;
}

.sidebar-cta {
  color: var(--_colour-modes---typography--body-colour);
  --_colour-modes---typography--body-colour: #e3ebf2;
  --_colour-modes---typography--heading-colour: var(--_colours---neutrals--white);
  padding: 200px 36px 36px;
  text-decoration: none;
  transition: all .35s;
  display: block;
  position: relative;
  overflow: hidden;
  box-shadow: 0 0 #0000, 0 2px .2px #00000006, 0 4px .4px #00000007, 0 6px .7px #00000008, 0 8px .9px #00000009, 0 11px 1.2px #00000009, 0 14px 1.6px #0000000a, 0 17px 2.1px #0000000a, 0 20px 2.7px #0000000a, 0 25px 3.5px #0000000b, 0 30px 4.4px #0000000b, 0 37px 5.8px #0000000b, 0 46px 7.5px #0000000b, 0 57px 9.9px #0000000b, 0 72px 13.2px #0000000c, 0 94px 17.8px #0000000c, 0 125px 24.8px #0000000c, 0 175px 36px #0000000d, 0 271px 57.8px #0000000e;
}

._2-grid {
  grid-column-gap: var(--spacing--large);
  grid-row-gap: var(--spacing--large);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.menu-button {
  order: 1;
  padding: .75rem;
}

.burger-menu {
  cursor: pointer;
  background-color: #fff;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.text-large {
  font-size: var(--_responsive---font-size--text-large);
}

.text-small {
  font-size: var(--_responsive---font-size--text-small);
}

.medium-marg-bottom {
  margin-bottom: var(--spacing--medium);
}

.small-marg-bottom {
  margin-bottom: var(--spacing--small);
}

.style-guide-tag {
  color: #fff;
  letter-spacing: .01em;
  background-color: #0073e6;
  border-radius: 3px;
  padding: .08em .6em;
  font-size: .8rem;
  line-height: 1.7;
  display: inline-block;
  position: relative;
  top: -1px;
}

.style-guide-tag.is-html-el {
  background-color: #d13591;
}

.style-guide-type-block {
  flex: 1;
  min-width: 30rem;
}

.style-guide-type-wrap {
  grid-column-gap: var(--spacing--small);
  grid-row-gap: var(--spacing--small);
  flex-flow: wrap;
  display: flex;
}

.style-guide-margin-wrapper {
  background-image: url('../images/bg-margin.svg');
  background-position: 0 0;
  background-size: 6px;
  padding: 1px;
}

.style-guide-margin-card {
  padding: var(--spacing--small);
  background-color: var(--_colours---neutrals--white);
  border: 1px solid #0073e6;
}

.style-guide-grid-row {
  grid-column-gap: var(--spacing--small);
  grid-row-gap: var(--spacing--small);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  place-items: start stretch;
  display: grid;
}

.style-guide-grid-row.is-5-col {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}

.style-guide-grid-row.is-2-col {
  grid-template-columns: 1fr 1fr;
}

.style-guide-section-heading {
  margin-bottom: var(--spacing--medium);
  padding-bottom: var(--spacing--x-small);
  border-bottom: 1px solid var(--_colours---elements--border);
}

.style-guide-row {
  grid-column-gap: var(--spacing--medium);
  grid-row-gap: var(--spacing--medium);
  flex-flow: row;
  width: 100%;
  display: flex;
}

.style-guide-style-card {
  border-radius: var(--border-radius--medium);
  background-color: var(--_colours---neutrals--white);
  border: 1px solid #5aa4ff;
  overflow: clip;
}

.sg-style-card-content {
  padding: var(--spacing--small);
}

.sg-style-card-colour {
  background-color: var(--_colours---elements--light-bg);
  justify-content: center;
  align-items: center;
  min-height: 8rem;
  display: flex;
}

.sg-style-card-colour.is-1 {
  background-color: var(--_colours---primary--colour-1);
}

.sg-style-card-colour.is-2 {
  background-color: var(--_colours---secondary--colour-2);
}

.sg-style-card-colour.is-3 {
  background-color: var(--_colours---secondary--colour-3);
}

.sg-style-card-colour.is-4 {
  background-color: var(--_colours---neutrals--mid-grey);
}

.sg-style-card-colour.is-5 {
  background-color: var(--_colours---neutrals--light-grey);
}

.sg-style-card-colour.is-6 {
  background-color: var(--_colours---neutrals--black);
}

.sg-style-card-colour.is-7 {
  background-color: var(--_colours---neutrals--white);
}

.sg-style-card-colour.is-8 {
  background-color: var(--_colours---neutrals--dark-grey);
}

.sg-style-card-colour.is-dark {
  background-color: var(--_colours---elements--dark-bg);
}

.sg-style-card-colour.is-9 {
  background-color: var(--_colours---secondary--colour-4);
}

.sg-style-card-colour.is-10 {
  background-color: var(--_colours---secondary--colour-5);
}

.faq-wrap {
  margin-top: 1rem;
  margin-bottom: 1rem;
  padding-left: 0;
  list-style-type: none;
}

.faq-question-item {
  border-bottom: 1px solid #e1e1e1;
  width: 100%;
}

.faq-question-bar {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  cursor: pointer;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding-top: 1rem;
  padding-bottom: 1rem;
  padding-right: 1rem;
  text-decoration: none;
  display: flex;
}

.faq-question {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 1.15rem;
  line-height: 1.4;
}

.faq-icon {
  aspect-ratio: 1;
  background-color: var(--_colours---neutrals--mid-grey);
  border-radius: 100vw;
  justify-content: center;
  align-items: center;
  width: 1.75rem;
  font-family: "Fa 400", Arial, sans-serif;
  line-height: 1;
  display: flex;
}

.faq-content {
  width: 100%;
  font-size: .9rem;
  overflow: hidden;
}

.dialog-inner-wrap {
  text-align: left;
  overscroll-behavior: contain;
  flex-flow: column;
  height: auto;
  display: flex;
  position: relative;
}

.dialog-content {
  flex-flow: column;
  justify-content: flex-start;
  align-items: stretch;
  height: auto;
  padding-bottom: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  display: flex;
}

.dialog {
  z-index: 1000;
  border-top-style: solid;
  border-top-width: 1px;
  border-top-color: var(--_colours---elements--border);
  border-right-style: solid;
  border-right-width: 1px;
  border-right-color: var(--_colours---elements--border);
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-bottom-color: var(--_colours---elements--border);
  border-left-style: solid;
  border-left-width: 1px;
  border-left-color: var(--_colours---elements--border);
  background-color: var(--_colours---neutrals--white);
  scrollbar-width: none;
  overscroll-behavior: contain;
  border-radius: .5rem;
  width: 95%;
  max-width: 40rem;
  max-height: 28rem;
  padding: 1rem;
  position: fixed;
  inset: 0%;
  overflow: scroll;
}

.dialog-close {
  aspect-ratio: 1;
  background-color: #efefef00;
  border-radius: .25rem;
  align-self: flex-end;
  padding: .25rem;
  font-family: "Fa 400", Arial, sans-serif;
  font-size: .9em;
  line-height: 1;
  transition: background-color .3s;
}

.dialog-close:hover {
  color: #092e59;
  background-color: #ebeef2;
}

.nav-bg {
  position: absolute;
  inset: 0%;
}

.nav-bg:where(.w-variant-409cd44e-69b9-93ab-2ed2-bc7dc7c0b190) {
  background-color: var(--_colours---secondary--colour-2);
}

.dropdown-navlink {
  padding-top: var(--spacing--x-small);
  padding-right: var(--spacing--x-small);
  padding-bottom: var(--spacing--x-small);
  padding-left: var(--spacing--x-small);
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  color: inherit;
  -webkit-text-decoration: inherit;
  text-decoration: inherit;
  background-color: #f7f7f700;
  border-radius: .5rem;
  justify-content: flex-start;
  align-items: center;
  font-size: .875rem;
  font-weight: 500;
  transition-property: background-color, color;
  transition-duration: .3s, .3s;
  transition-timing-function: ease, ease;
  display: flex;
}

.dropdown-navlink.mega-menu {
  justify-content: space-between;
  align-items: center;
  padding: .5rem;
}

.dropdown-navlink.mega-menu:hover {
  background-color: var(--_colours---neutrals--light-grey);
  color: var(--_colours---primary--colour-1);
}

.dropdown-link-text {
  opacity: .7;
  color: #071222;
  font-size: .75rem;
  font-weight: 400;
}

.mega-menu-inner-grid {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.mega-menu-left {
  padding-top: .5rem;
}

.mega-dropdown-toggle {
  margin-left: 0;
  margin-right: 0;
  display: none;
  position: static;
}

.mega-menu-dropdown {
  border-radius: 10px;
  padding: 1.5rem;
}

.mega-menu-dropdown.w--open {
  color: #071222;
  background-color: #fff;
  border-radius: .25rem;
  max-width: 75rem;
  position: absolute;
  inset: 5.5rem 0 auto;
  box-shadow: 0 20px 60px #0000001a;
}

.mega-menu-grid {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  grid-template-rows: auto;
  grid-template-columns: 1fr .5fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.mega-menu-title {
  letter-spacing: -.025em;
  margin-bottom: .5rem;
  margin-left: .5rem;
  font-size: 1.1rem;
  font-weight: 500;
}

.mega-menu-more {
  background-color: #f2f4fa;
  border-radius: .25rem;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  padding: 1rem 1rem .5rem;
  display: flex;
}

.mega-link-arrow {
  border-radius: 100%;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 2rem;
  height: 2rem;
  font-family: "Fa 400", Arial, sans-serif;
  font-size: .8em;
  line-height: 1;
  display: flex;
}

.mm-link-content {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.dropdown-link-icon {
  background-color: #f2f4fa;
  border-radius: .25rem;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 2.75rem;
  height: 2.75rem;
  font-family: "Fa Sharp Solid 900", Arial, sans-serif;
  line-height: 1;
  display: flex;
}

.image-fill-wrapper {
  border-radius: var(--border-radius--small);
  position: relative;
  overflow: clip;
}

.image-fill-wrapper.in-2-grid {
  min-height: 20rem;
}

.image-fill {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
}

._2-grid-content {
  width: 100%;
  max-width: 34rem;
  margin-left: auto;
  margin-right: auto;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

.text-link {
  color: var(--_colours---primary--colour-1);
  text-underline-offset: .15em;
  justify-content: flex-start;
  align-items: flex-end;
  display: inline-flex;
}

.text-link:where(.w-variant-6ff76dcb-55f7-99b5-20cd-eaa146d7d55f) {
  color: var(--_colours---secondary--colour-3);
}

.text-link:hover {
  text-decoration: underline;
}

.inline-link {
  color: var(--_colours---primary--colour-1);
  font-weight: 600;
  text-decoration: underline;
}

.sg-fa-icon-inline {
  background-color: var(--_colours---neutrals--white);
  border: 1px solid #0073e6;
  padding: .25em;
  line-height: 1.1;
}

.sg-sections-wrapper {
  border: 1px solid var(--_colours---elements--border);
  box-shadow: 0 1px 4px 2px #0000000d;
}

.sg-content-wrapper-wrap {
  padding-right: var(--spacing--medium);
  padding-left: var(--spacing--medium);
  background-image: url('../images/bg-margin.svg');
  background-position: 0 0;
  background-size: 6px;
  min-height: 5rem;
  display: flex;
}

.sg-content-wrapper-inner {
  grid-column-gap: var(--spacing--small);
  grid-row-gap: var(--spacing--small);
  border: 1px solid var(--_colours---elements--border);
  background-color: var(--_colours---neutrals--white);
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
}

.cards-grid-container {
  grid-column-gap: var(--spacing--medium);
  grid-row-gap: var(--spacing--medium);
  text-align: left;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.landscape-image-wrap {
  aspect-ratio: 3 / 2;
  position: relative;
}

.centred-section-header {
  text-align: center;
  text-wrap: pretty;
  flex-direction: column;
  justify-content: center;
  max-width: 40rem;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.inner-page-content-grid {
  grid-column-gap: 52px;
  grid-row-gap: 52px;
  grid-template-rows: auto;
  grid-template-columns: 1.25fr .75fr;
}

.sidebar {
  background-color: #fff;
  flex-direction: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
  position: sticky;
  top: 132px;
  box-shadow: 14px 14px 55px #0000001a;
}

.sidebar-content {
  background-color: #fff;
  border: .5px solid #d8d8d8;
  padding: 36px;
}

.sidebar-info-wrapper {
  z-index: 1;
  flex-direction: column;
  display: flex;
  position: relative;
}

.sidebar-image {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
}

.sidebar-bg-wash {
  background-image: linear-gradient(#fff0 18%, #000 85%);
  position: absolute;
  inset: 0%;
}

.x-small-marg-bottom {
  margin-bottom: var(--spacing--x-small);
}

.x-small-marg-top {
  margin-top: var(--spacing--x-small);
}

.x-large-marg-top {
  margin-top: var(--spacing--xtra-large);
}

.x-large-marg-bottom {
  margin-bottom: var(--spacing--xtra-large);
}

.tiny-marg-top {
  margin-top: var(--spacing--tiny);
}

.tiny-marg-bottom {
  margin-bottom: var(--spacing--tiny);
}

.nav-middle {
  flex: 1;
  justify-content: center;
  align-items: center;
  display: flex;
}

.hero-grid {
  grid-column-gap: var(--spacing--large);
  grid-row-gap: var(--spacing--large);
  text-wrap: balance;
  grid-template-rows: auto;
  grid-template-columns: 1fr .25fr 1fr;
  max-width: 900px;
  margin-top: 2rem;
  margin-left: auto;
  margin-right: auto;
}

.pill {
  padding: var(--spacing--tiny) var(--spacing--small);
  border: 1px solid var(--_colours---neutrals--white);
  font-size: var(--_responsive---font-size--text-small);
  text-transform: uppercase;
  border-radius: 99rem;
}

.left-hero-wrapper {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.hero-divider-wrapper {
  grid-column-gap: var(--spacing--small);
  grid-row-gap: var(--spacing--small);
  justify-content: center;
  align-items: center;
  display: flex;
}

.main-divider {
  background-color: var(--_colours---neutrals--white);
  width: 1px;
  height: 100%;
}

.small-divider {
  background-color: var(--_colours---neutrals--white);
  width: 1px;
  height: 50%;
}

.nav-button-wrapper {
  display: block;
}

.contact-wrapper {
  grid-column-gap: var(--spacing--small);
  grid-row-gap: var(--spacing--small);
  font-size: 1.6rem;
  display: flex;
}

.div-block {
  grid-column-gap: var(--spacing--x-small);
  grid-row-gap: var(--spacing--x-small);
  flex-flow: column;
  display: flex;
}

@media screen and (min-width: 1280px) {
  body {
    --_responsive---font-size--body: 1rem;
    --_responsive---font-size--h1: 4.25rem;
    --_responsive---font-size--h2: 3.25rem;
    --_responsive---font-size--h3: 2.5rem;
    --_responsive---font-size--h4: 1.75rem;
    --_responsive---font-size--h5: 1.2rem;
    --_responsive---font-size--h6: 1rem;
    --_responsive---font-size--text-small: .875rem;
    --_responsive---font-size--text-large: 1.15rem;
  }

  .content-wrapper {
    max-width: var(--content-wrapper--wide);
  }

  .content-wrapper.in-hero {
    max-width: var(--content-wrapper--regular);
  }

  .nav-menu {
    position: static;
  }

  .nav-flex {
    max-width: var(--content-wrapper--wide);
  }

  .mega-menu-inner-grid {
    max-width: 1350px;
  }

  .mega-menu-dropdown.w--open {
    border-radius: 5px;
    max-width: 82rem;
    position: absolute;
    box-shadow: 0 20px 60px #0000000d;
  }
}

@media screen and (max-width: 991px) {
  body {
    --_responsive---font-size--body: 1rem;
    --_responsive---font-size--h1: 3.25rem;
    --_responsive---font-size--h2: 2.5rem;
    --_responsive---font-size--h3: 1.75rem;
    --_responsive---font-size--h4: 1.5rem;
    --_responsive---font-size--h5: 1.1rem;
    --_responsive---font-size--h6: 1rem;
    --_responsive---font-size--text-small: .875rem;
    --_responsive---font-size--text-large: 1rem;
  }

  .section {
    padding: var(--spacing--large) var(--spacing--medium);
  }

  .section.is-ip-header {
    padding-top: 120px;
  }

  .utility-page-content {
    width: 100%;
  }

  .h1.is-hero {
    font-size: 2.6rem;
  }

  .style-guide-section-card {
    padding: var(--spacing--medium);
  }

  .nav-right {
    flex: 1;
  }

  .nav-menu {
    background-color: #fff;
    max-height: 80dvh;
    padding: 1.5rem;
    position: absolute;
    overflow: scroll;
  }

  .navbar {
    padding-right: var(--spacing--medium);
    padding-left: var(--spacing--medium);
    justify-content: space-between;
  }

  .navlink {
    color: var(--_colours---neutrals--black);
    padding: .75rem;
  }

  .navlink:hover, .navlink.w--current {
    color: var(--_colours---primary--colour-1);
  }

  .navlink.dropdown {
    flex-direction: row;
    justify-content: flex-start;
    width: 100%;
    display: flex;
  }

  .navlink.extra {
    color: var(--_colours---neutrals--white);
    display: none;
  }

  .logo {
    flex: 0 auto;
    order: -1;
    margin-right: 0;
  }

  .dropdown-list.w--open {
    box-shadow: none;
    background-color: #0000;
    min-width: auto;
    padding: 0;
    position: static;
  }

  .socials-wrapper {
    flex-direction: row;
    justify-content: center;
  }

  .footer-logo {
    margin-bottom: 2rem;
  }

  .footer {
    padding-top: var(--spacing--large);
    padding-right: var(--spacing--medium);
    padding-left: var(--spacing--medium);
  }

  .footer-column {
    padding-right: 20px;
  }

  .footer-grid {
    grid-template-columns: 1.5fr;
  }

  .button-row.in-hero {
    justify-content: center;
    align-items: center;
  }

  ._2-grid {
    grid-column-gap: var(--spacing--medium);
    grid-row-gap: var(--spacing--medium);
    grid-template-columns: 1fr;
  }

  .menu-button {
    filter: invert();
    color: #fff;
    text-align: right;
    flex: none;
    order: 1;
    justify-content: center;
    align-items: center;
  }

  .menu-button.w--open {
    background-color: #0000;
  }

  .burger-menu {
    background-color: #0000;
    width: 1.75rem;
    height: 1.75rem;
  }

  .menu-lottie {
    filter: invert();
    width: 100%;
  }

  .menu-lottie:where(.w-variant-409cd44e-69b9-93ab-2ed2-bc7dc7c0b190) {
    filter: none;
  }

  .dropdown-navlink {
    padding-right: var(--spacing--small);
    padding-left: var(--spacing--small);
  }

  .dropdown-navlink.mega-menu {
    padding-left: 1rem;
  }

  .dropdown-link-text {
    display: none;
  }

  .mega-menu-inner-grid {
    grid-row-gap: 0px;
    grid-template-columns: 1fr;
  }

  .mega-menu-left {
    padding: 0;
  }

  .mega-menu-dropdown.w--open {
    box-shadow: none;
    background-color: #f2f4fa;
    padding: .5rem;
    position: static;
  }

  .mega-menu-grid {
    grid-row-gap: 0px;
    grid-template-columns: 1fr;
  }

  .mega-menu-title {
    display: none;
  }

  .mega-menu-more {
    background-color: #0000;
    padding: 0;
    display: none;
  }

  .mega-link-arrow, .dropdown-link-icon {
    display: none;
  }

  .image-fill-wrapper.in-2-grid {
    aspect-ratio: 16 / 9;
    min-height: auto;
  }

  ._2-grid-content {
    order: -1;
    max-width: none;
    margin-left: 0;
    padding-top: 0;
    padding-bottom: 0;
  }

  .cards-grid-container {
    grid-column-gap: 20px;
  }

  .contact-wrapper {
    font-size: 1.1rem;
  }
}

@media screen and (max-width: 767px) {
  body {
    --_responsive---font-size--body: .875rem;
    --_responsive---font-size--h1: 2.75rem;
    --_responsive---font-size--h2: 2rem;
    --_responsive---font-size--h3: 1.5rem;
    --_responsive---font-size--h4: 1.25rem;
    --_responsive---font-size--h5: 1rem;
    --_responsive---font-size--h6: .9rem;
    --_responsive---font-size--text-small: .75rem;
    --_responsive---font-size--text-large: .9rem;
  }

  .section.is-ip-header {
    padding-top: 52px;
  }

  .section.is-hero {
    padding-top: 8rem;
    padding-bottom: 4.2rem;
  }

  .h1.is-hero {
    font-size: 2.1rem;
  }

  .style-guide-section-card {
    padding-left: 20px;
    padding-right: 20px;
  }

  .style-body {
    padding: 1.25rem;
  }

  .nav-menu {
    box-shadow: 0 60px 60px #0000001a;
  }

  .nav-section {
    margin-top: var(--spacing--small);
  }

  .navlink.extra {
    flex: none;
    display: block;
  }

  .copyright-grid {
    grid-template-columns: 1fr;
    justify-items: center;
  }

  .footer {
    font-size: .9rem;
  }

  .footer-column {
    padding-right: 0;
  }

  ._2-grid {
    grid-column-gap: var(--spacing--small);
    grid-row-gap: var(--spacing--small);
  }

  .burger-menu {
    width: 1.5rem;
    height: 1.5rem;
  }

  .style-guide-type-block {
    min-width: auto;
  }

  .style-guide-type-wrap {
    flex-flow: column;
  }

  .faq-question {
    font-size: .9rem;
  }

  .dialog {
    max-height: 100%;
    padding: .5rem;
  }

  .mega-menu-inner-grid {
    grid-row-gap: 0px;
    grid-template-columns: 1fr;
  }

  .cards-grid-container {
    grid-template-rows: auto auto auto;
    grid-template-columns: 1fr;
    align-self: stretch;
    max-width: none;
  }

  .inner-page-content-grid {
    grid-template-columns: 1fr;
  }

  .sidebar {
    position: static;
  }

  .hero-grid {
    grid-column-gap: var(--spacing--small);
    grid-row-gap: var(--spacing--small);
    grid-template-columns: .75fr .25fr 1.25fr;
    margin-top: 0;
  }

  .nav-button-wrapper {
    display: none;
  }
}

@media screen and (max-width: 479px) {
  body {
    --_responsive---font-size--body: .875rem;
    --_responsive---font-size--h1: 2.75rem;
    --_responsive---font-size--h2: 2rem;
    --_responsive---font-size--h3: 1.5rem;
    --_responsive---font-size--h4: 1.25rem;
    --_responsive---font-size--h5: 1rem;
    --_responsive---font-size--h6: .9rem;
    --_responsive---font-size--text-small: .75rem;
    --_responsive---font-size--text-large: .9rem;
  }

  .btn-primary.nav {
    display: none;
  }

  .section {
    padding-right: var(--spacing--small);
    padding-left: var(--spacing--small);
  }

  .h1.is-hero {
    font-size: 2.4rem;
  }

  .nav-right {
    margin-left: var(--spacing--small);
    grid-column-gap: var(--spacing--tiny);
    grid-row-gap: var(--spacing--tiny);
  }

  .nav-menu {
    padding: 1rem;
    font-size: .9rem;
  }

  .nav-section {
    margin-top: var(--spacing--small);
  }

  .navbar {
    padding: .5rem var(--spacing--small);
  }

  .navlink {
    padding-top: .5rem;
  }

  .navlink.extra {
    border: 1px solid var(--_colours---neutrals--white);
    border-radius: var(--spacing--tiny);
    flex: 1;
    justify-content: center;
    align-items: center;
    padding-bottom: .5rem;
    display: flex;
  }

  .logo {
    padding-left: 0;
  }

  .footer {
    padding-right: var(--spacing--small);
    padding-left: var(--spacing--small);
  }

  .footer-grid {
    grid-template-columns: 1fr;
  }

  .sidebar-cta {
    padding: 72px 24px 24px;
  }

  .style-guide-grid-row {
    grid-template-columns: 1fr;
  }

  .style-guide-grid-row.is-5-col {
    grid-template-columns: 1fr 1fr;
  }

  .faq-question-bar {
    padding: .75rem;
  }

  .faq-question {
    flex: 1;
  }

  .faq-content {
    padding-left: 12px;
    padding-right: 12px;
  }

  .dialog-inner-wrap {
    height: auto;
  }

  .dialog-content {
    padding-bottom: .5rem;
    padding-left: .5rem;
    padding-right: .5rem;
  }

  .dropdown-link-text {
    display: none;
  }

  .mega-menu-inner-grid {
    grid-template-columns: 1fr;
  }

  .dropdown-link-icon {
    display: none;
  }

  .cards-grid-container {
    grid-template-columns: 1fr;
    margin-left: 0;
    margin-right: 0;
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .sidebar-content {
    padding: 28px;
  }

  .hero-grid {
    grid-column-gap: var(--spacing--small);
    grid-row-gap: var(--spacing--small);
    text-align: center;
    grid-template-columns: 1fr;
  }

  .hero-divider-wrapper {
    flex-flow: column;
    min-height: 32px;
  }

  .main-divider {
    width: 100px;
    height: 1px;
  }

  .small-divider {
    width: 50px;
    height: 1px;
  }

  .navlink-extra-text {
    display: none;
  }

  .div-block {
    justify-content: flex-start;
    align-items: center;
  }
}

#w-node-_446c44e8-c3c4-877a-31b1-158c61b0b7b3-bfb038f6 {
  align-self: center;
}

#w-node-_595dc2b7-6c4c-2752-432d-effd8ad3de75-bfb038fa {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

#w-node-f9b5217a-3d04-2d96-f288-77857878eb98-bfb038fa, #w-node-_1a3d3ba3-4c4b-23ae-ea6b-cd489df676f3-bfb038fa, #w-node-f78ed1ad-e967-3f2d-4181-86a888e00717-bfb038fa, #w-node-_227eeaa9-80d8-250a-0ebc-4f49806518aa-bfb038fa, #w-node-_08802934-6965-8b93-fd96-f183458b0ae6-bfb038fa, #w-node-_9b159e62-5dcd-c5c5-e9e6-928280906ee6-bfb038fa, #w-node-_722e1e2c-7e6c-0d4e-68ea-0398c76308ce-bfb038fa, #w-node-_722e1e2c-7e6c-0d4e-68ea-0398c76308d4-bfb038fa, #w-node-e19c557d-3a96-10ec-fa01-1e995fa92585-5fa92534, #w-node-e19c557d-3a96-10ec-fa01-1e995fa92589-5fa92534, #w-node-d0b9efa6-af6c-264d-0218-a4f80d33c1c7-bfb038fd {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

@media screen and (max-width: 991px) {
  #w-node-e19c557d-3a96-10ec-fa01-1e995fa92537-5fa92534, #w-node-e19c557d-3a96-10ec-fa01-1e995fa9253a-5fa92534, #w-node-e19c557d-3a96-10ec-fa01-1e995fa9254c-5fa92534, #w-node-e19c557d-3a96-10ec-fa01-1e995fa9255f-5fa92534, #w-node-e19c557d-3a96-10ec-fa01-1e995fa92571-5fa92534 {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }
}


@font-face {
  font-family: 'Fa Solid 900';
  src: url('../fonts/fa-solid-900.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fa Sharp Duotone 300';
  src: url('../fonts/fa-sharp-duotone-light-300.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fa 300';
  src: url('../fonts/fa-light-300.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fa 100';
  src: url('../fonts/fa-thin-100.woff2') format('woff2');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fa Duotone 400';
  src: url('../fonts/fa-duotone-regular-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fa Sharp Solid 900';
  src: url('../fonts/fa-sharp-solid-900.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fa Sharp 400';
  src: url('../fonts/fa-sharp-regular-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fa Sharp 100';
  src: url('../fonts/fa-sharp-thin-100.woff2') format('woff2');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fa Sharp Duotone Solid 900';
  src: url('../fonts/fa-sharp-duotone-solid-900.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fa Sharp Duotone 400';
  src: url('../fonts/fa-sharp-duotone-regular-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fa Brands 400';
  src: url('../fonts/fa-brands-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fa Sharp 300';
  src: url('../fonts/fa-sharp-light-300.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fa 400';
  src: url('../fonts/fa-regular-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fa Duotone 900';
  src: url('../fonts/fa-duotone-900.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fa V 4 Compatibility';
  src: url('../fonts/fa-v4compatibility.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fa Sharp Duotone 100';
  src: url('../fonts/fa-sharp-duotone-thin-100.woff2') format('woff2');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fa Duotone 100';
  src: url('../fonts/fa-duotone-thin-100.woff2') format('woff2');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fa Duotone 300';
  src: url('../fonts/fa-duotone-light-300.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Figtree Variablefont Wght';
  src: url('../fonts/Figtree-Italic-VariableFont_wght.ttf') format('truetype');
  font-weight: 300 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Figtree Variablefont Wght';
  src: url('../fonts/Figtree-VariableFont_wght.ttf') format('truetype');
  font-weight: 300 900;
  font-style: normal;
  font-display: swap;
}