@font-face {
    font-family: 'AGDelta';
    src: url('../assets/fonts/AGDeltaVARVF.woff2') format('woff2-variations'), url('../assets/fonts/AGDeltaVARVF.woff2') format('woff2 supports variations');
    font-style: normal bold;
    font-weight: 400 700;
}

@font-face {
    font-family: 'AGMore-Headline';
    src: url('../assets/fonts/AGMore-Headline.otf') format('opentype');
    font-style: normal bold;
    font-weight: 500 700;
}

:root {
    /* Primary colours */
    --black: 30, 32, 25;
    --white: 255, 255, 255;
    /* Group colour */
    --group-colour: 0, 72, 30;
    --tonal-green: 4, 106, 56;
    /* Info States */
    --state-valid: 79, 226, 0;
    --state-valid-light: 233, 248, 225;
    --state-error: 205, 61, 61;
    --state-error-light: 245, 231, 231;
    --state-pending: 255, 138, 0;
    --state-info: 61, 136, 205;
    --state-info-light: 231, 239, 245;
    /* Opacity */
    --text-opacity: 1;
    --bg-opacity: 1;
    --ald-border-opacity: 1;
}

.aldermore {
    --primary-colour: 79, 226, 0;
    --primary-colour-hover: 149, 238, 102;
    --primary-colour-pressed: 114, 232, 51;
    --secondary-colour-hover: 120, 121, 117;
    --secondary-colour-pressed: 75, 77, 71;
    --secondary-light-colour-hover: 232, 233, 232;
    --secondary-light-colour-pressed: 210, 210, 209;
    --soft-primary: 218, 247, 213;
    --grey-light: 245, 244, 247;
}

.motonovo {
    --primary-colour: 0, 255, 255;
    --primary-colour-hover: 163, 244, 255;
    --primary-colour-pressed: 92, 236, 255;
    --secondary-colour-hover: 120, 121, 117;
    --secondary-colour-pressed: 75, 77, 71;
    --secondary-light-colour-hover: 232, 233, 232;
    --secondary-light-colour-pressed: 210, 210, 209;
    --soft-primary: 199, 239, 255;
    --grey-light: 245, 244, 247;
}

.colour__swatch {
    column-gap: 1.25rem;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 2rem;
    row-gap: 3rem;
}

.background__primary-soft {
    background-color: rgb(var(--soft-primary));
}

.background__primary {
    background-color: rgb(var(--primary-colour));
}

.background__group {
    background-color: rgb(var(--group-colour));
}

.background__group-tonal {
    background-color: rgb(var(--tonal-green));
}

.background__grey-light {
    background-color: rgb(var(--grey-light));
}

.background__white {
    background-color: rgb(var(--white));
}

.background__black {
    background-color: rgb(var(--black));
}

.background__state-error {
    background-color: rgba(var(--state-error), var(--bg-opacity));
}

.background__state-error--light {
    background-color: rgb(var(--state-error-light));
}

.background__state-error.transparent {
    --bg-opacity: 0.1;
}

.background__state-info {
    background-color: rgba(var(--state-info), var(--bg-opacity));
}

.background__state-info--light {
    background-color: rgb(var(--state-info-light));
}

.background__state-info.transparent {
    --bg-opacity: 0.1;
}

.background__state-valid {
    background-color: rgba(var(--state-valid), var(--bg-opacity));
}

.background__state-valid--light {
    background-color: rgb(var(--state-valid-light));
}

.background__state-valid.transparent {
    --bg-opacity: 0.1;
}

.border__state-error {
    border-color: rgb(var(--state-error));
    border-width: 0.0625rem;
    border-style: solid;
}

.border__state-info {
    border-color: rgb(var(--state-info));
    border-width: 0.0625rem;
    border-style: solid;
}

.border__state-valid {
    border-color: rgb(var(--state-valid));
    border-width: 0.0625rem;
    border-style: solid;
}

.text__white {
    color: rgb(var(--white));
}

.text__black {
    color: rgb(var(--black));
}

.text__primary {
    color: rgb(var(--primary-colour));
}

/* 

Basic font 'utility' classes that replace the inital Tailwind config  
and base element style selectors.

*/

:root {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: antialiased;
    --font-input-default: 1.125rem;
    --font-label-default: 0.875rem;
    --font-a-default: 1rem;
    --font-a-highvp: 1rem;
    --font-span-default: 0.875rem;
    --font-span-small-default: 0.75rem;
    --font-span-large-default: 1.5rem;
    /* hierarchy headers default */
    --font-h1-default: 4.25rem;
    --font-h2-default: 2rem;
    --font-h3-default: 1.75rem;
    --font-h4-default: 1.5rem;
    --font-h5-default: 1.375rem;
    --font-h6-default: 1.25rem;
    /* hierarchy headers medium */
    --font-h1-medium: 4.625rem;
    --font-h2-medium: 2.125rem;
    --font-h3-medium: 1.875rem;
    --font-h4-medium: 1.625rem;
    --font-h5-medium: 1.375rem;
    --font-h6-medium: 1.25rem;
    /* hierarchy headers large */
    --font-h1-large: 5rem;
    --font-h2-large: 2.25rem;
    --font-h3-large: 2rem;
    --font-h4-large: 1.75rem;
    --font-h5-large: 1.5rem;
    --font-h6-large: 1.25rem;
    /* homepage headers default */
    --font-h1-default-homepage: 4.75rem;
    --font-h2-default-homepage: 2.25rem;
    --font-h3-default-homepage: 1.75rem;
    --font-h4-default-homepage: 1.75rem;
    --font-h5-default-homepage: 1.5rem;
    --font-h6-default-homepage: 1.25rem;
    /* homepage headers medium */
    --font-h1-medium-homepage: 5rem;
    --font-h2-medium-homepage: 2.25rem;
    --font-h3-medium-homepage: 1.875rem;
    --font-h4-medium-homepage: 1.75rem;
    --font-h5-medium-homepage: 1.5rem;
    --font-h6-medium-homepage: 1.25rem;
    /* homepage headers large */
    --font-h1-large-homepage: 6.25rem;
    --font-h2-large-homepage: 2.25rem;
    --font-h3-large-homepage: 2rem;
    --font-h4-large-homepage: 1.75rem;
    --font-h5-large-homepage: 1.5rem;
    --font-h6-large-homepage: 1.25rem;
    /* paragraph fonts */
    --font-p-default: 1rem;
    --font-p-large: 1.125rem;
    --font-p-subtitle: 0.875rem;
    --font-p-caption: 0.75rem;
}

.aldermore {
    --font-body-copy: 'AGDelta','Arial', 'sans-serif';
    --font-headline: 'AGMore-Headline','Arial', 'sans-serif';
}

.motonovo {
    --font-body-copy: 'AGDelta','Arial', 'sans-serif';
    --font-headline: 'AGForward','Arial', 'sans-serif';
}

.font-regular {
    font-family: var(--font-body-copy);
    font-weight: normal;
}

.font-bold {
    font-family: var(--font-body-copy);
    font-weight: bold;
}

.font-headline {
    font-family: var(--font-headline);
}

.font-display {
    font-family: var(--font-heavy);
}

.font-header {
    font-family: var(--font-headline);
}

.font-paragraph {
    font-family: var(--font-body-copy);
}

.font-colour__white {
    color: rgb(var(--white));
    opacity: var(--text-opacity);
}

.font-colour__black {
    color: rgb(var(--black));
    opacity: var(--text-opacity);
}

.font-colour__violet {
    color: rgb(var(--violet));
    opacity: var(--text-opacity);
}

.font-colour__cassis {
    color: rgb(var(--cassis));
    opacity: var(--text-opacity);
}

.font-colour__verdant {
    color: rgb(var(--verdant));
    opacity: var(--text-opacity);
}

.font-colour__teal {
    color: rgb(var(--teal));
    opacity: var(--text-opacity);
}

.font-colour__form-red {
    color: rgb(var(--form-red));
    opacity: var(--text-opacity);
}

h1 {
    font-family: var(--font-headline);
    font-size: var(--font-size, var(--font-h1-default));
    letter-spacing: calc(var(--font-size, var(--font-h1-default)) * -0.02);
    line-height: 100%;
}

@media (min-width: 640px) {

    h1 {
        --font-size: var(--font-h1-medium)
    }
}

@media (min-width: 1024px) {

    h1 {
        --font-size: var(--font-h1-large)
    }
}

h1.homepage {
    --font-size: var(--font-h1-default-homepage);
}

@media (min-width: 640px) {

    h1.homepage {
        --font-size: var(--font-h1-medium-homepage)
    }
}

@media (min-width: 1024px) {

    h1.homepage {
        --font-size: var(--font-h1-large-homepage)
    }
}

h2 {
    --font-family: var(--font-body-copy);
    font-weight: bold;
    font-family: var(--font-family);
    font-size: var(--font-size, var(--font-h2-default));
    letter-spacing: calc(var(--font-size, var(--font-h2-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    h2 {
        --font-size: var(--font-h2-medium)
    }
}

@media (min-width: 1024px) {

    h2 {
        --font-size: var(--font-h2-large)
    }
}

h2.homepage {
    --font-size: var(--font-h2-default-homepage);
}

@media (min-width: 640px) {

    h2.homepage {
        --font-size: var(--font-h2-medium-homepage)
    }
}

@media (min-width: 1024px) {

    h2.homepage {
        --font-size: var(--font-h2-large-homepage)
    }
}

h3 {
    --font-family: var(--font-body-copy);
    font-weight: bold;
    font-family: var(--font-family);
    font-size: var(--font-size, var(--font-h3-default));
    letter-spacing: calc(var(--font-size, var(--font-h3-default)) * -0.02);
    --line-height: 120%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    h3 {
        --font-size: var(--font-h3-medium)
    }
}

@media (min-width: 1024px) {

    h3 {
        --font-size: var(--font-h3-large)
    }
}

h3.homepage {
    --font-size: var(--font-h3-default-homepage);
}

@media (min-width: 640px) {

    h3.homepage {
        --font-size: var(--font-h3-medium-homepage)
    }
}

@media (min-width: 1024px) {

    h3.homepage {
        --font-size: var(--font-h3-large-homepage)
    }
}

h4 {
    --font-family: var(--font-body-copy);
    font-weight: bold;
    font-family: var(--font-family);
    font-size: var(--font-size, var(--font-h4-default));
    letter-spacing: calc(var(--font-size, var(--font-h4-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    h4 {
        --font-size: var(--font-h4-medium)
    }
}

@media (min-width: 1024px) {

    h4 {
        --font-size: var(--font-h4-large)
    }
}

h4.homepage {
    --font-size: var(--font-h4-default-homepage);
}

@media (min-width: 640px) {

    h4.homepage {
        --font-size: var(--font-h4-medium-homepage)
    }
}

@media (min-width: 1024px) {

    h4.homepage {
        --font-size: var(--font-h4-large-homepage)
    }
}

h5 {
    --font-family: var(--font-body-copy);
    font-weight: bold;
    font-family: var(--font-family);
    font-size: var(--font-size, var(--font-h5-default));
    letter-spacing: calc(var(--font-size, var(--font-h5-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    h5 {
        --font-size: var(--font-h5-medium)
    }
}

@media (min-width: 1024px) {

    h5 {
        --font-size: var(--font-h5-large)
    }
}

h5.homepage {
    --font-size: var(--font-h5-default-homepage);
}

@media (min-width: 640px) {

    h5.homepage {
        --font-size: var(--font-h5-medium-homepage)
    }
}

@media (min-width: 1024px) {

    h5.homepage {
        --font-size: var(--font-h5-large-homepage)
    }
}

h6 {
    --font-family: var(--font-body-copy);
    font-weight: bold;
    font-family: var(--font-family);
    font-size: var(--font-size, var(--font-h6-default));
    letter-spacing: calc(var(--font-size, var(--font-h6-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    h6 {
        --font-size: var(--font-h6-medium)
    }
}

@media (min-width: 1024px) {

    h6 {
        --font-size: var(--font-h6-large)
    }
}

h6.homepage {
    --font-size: var(--font-h6-default-homepage);
}

@media (min-width: 640px) {

    h6.homepage {
        --font-size: var(--font-h6-medium-homepage)
    }
}

@media (min-width: 1024px) {

    h6.homepage {
        --font-size: var(--font-h6-large-homepage)
    }
}

.masthead-header {
    --font-size: var(--font-h1-default);
}

@media (min-width: 640px) {

    .masthead-header {
        --font-size: var(--font-h1-medium)
    }
}

@media (min-width: 1024px) {

    .masthead-header {
        --font-size: var(--font-h1-large)
    }
}

.masthead-header.homepage {
    --font-size: var(--font-h1-default-homepage);
}

@media (min-width: 640px) {

    .masthead-header.homepage {
        --font-size: var(--font-h1-medium-homepage)
    }
}

@media (min-width: 1024px) {

    .masthead-header.homepage {
        --font-size: var(--font-h1-large-homepage)
    }
}

.component-header-largest {
    --font-size: var(--font-h2-default);
    font-size: var(--font-size);
}

@media (min-width: 640px) {

    .component-header-largest {
        --font-size: var(--font-h2-medium)
    }
}

@media (min-width: 1024px) {

    .component-header-largest {
        --font-size: var(--font-h2-large)
    }
}

.component-header-largest.homepage {
    --font-size: var(--font-h2-default-homepage);
}

@media (min-width: 640px) {

    .component-header-largest.homepage {
        --font-size: var(--font-h2-medium-homepage)
    }
}

@media (min-width: 1024px) {

    .component-header-largest.homepage {
        --font-size: var(--font-h2-large-homepage)
    }
}

.component-header-large {
    --font-size: var(--font-h3-default);
    --line-height: 120%;
    font-size: var(--font-size);
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    .component-header-large {
        --font-size: var(--font-h3-medium)
    }
}

@media (min-width: 1024px) {

    .component-header-large {
        --font-size: var(--font-h3-large)
    }
}

.component-header-large.homepage {
    --font-size: var(--font-h3-default-homepage);
}

@media (min-width: 640px) {

    .component-header-large.homepage {
        --font-size: var(--font-h3-medium-homepage)
    }
}

@media (min-width: 1024px) {

    .component-header-large.homepage {
        --font-size: var(--font-h3-large-homepage)
    }
}

.component-header-medium {
    --font-family: var(--font-body-copy);
    --font-size: var(--font-h4-default);
    font-weight: bold;
    font-family: var(--font-family);
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size, var(--font-h4-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    .component-header-medium {
        --font-size: var(--font-h4-medium)
    }
}

@media (min-width: 1024px) {

    .component-header-medium {
        --font-size: var(--font-h4-large)
    }
}

.component-header-medium.homepage {
    --font-size: var(--font-h4-default-homepage);
}

@media (min-width: 640px) {

    .component-header-medium.homepage {
        --font-size: var(--font-h4-medium-homepage)
    }
}

@media (min-width: 1024px) {

    .component-header-medium.homepage {
        --font-size: var(--font-h4-large-homepage)
    }
}

.component-header-small {
    --font-family: var(--font-body-copy);
    --font-size: var(--font-h5-default);
    font-size: var(--font-size);
    font-weight: bold;
    letter-spacing: calc(var(--font-size, var(--font-h5-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    .component-header-small {
        --font-size: var(--font-h5-medium)
    }
}

@media (min-width: 1024px) {

    .component-header-small {
        --font-size: var(--font-h5-large)
    }
}

.component-header-small.homepage {
    --font-size: var(--font-h5-default-homepage);
}

@media (min-width: 640px) {

    .component-header-small.homepage {
        --font-size: var(--font-h5-medium-homepage)
    }
}

@media (min-width: 1024px) {

    .component-header-small.homepage {
        --font-size: var(--font-h5-large-homepage)
    }
}

.component-header-smallest {
    --font-family: var(--font-body-copy);
    --font-size: var(--font-h6-default);
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size, var(--font-h6-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    .component-header-smallest {
        --font-size: var(--font-h6-medium)
    }
}

@media (min-width: 1024px) {

    .component-header-smallest {
        --font-size: var(--font-h6-large)
    }
}

.component-header-smallest.homepage {
    --font-size: var(--font-h6-default-homepage);
}

@media (min-width: 640px) {

    .component-header-smallest.homepage {
        --font-size: var(--font-h6-medium-homepage)
    }
}

@media (min-width: 1024px) {

    .component-header-smallest.homepage {
        --font-size: var(--font-h6-large-homepage)
    }
}

p,
ol,
ul {
    --font-family: var(--font-body-copy);
    font-family: var(--font-family);
    font-size: var(--font-size, var(--font-p-default));
    /* The value after --font-size is a fallback if the variable has not been defined. */
    letter-spacing: calc(var(--font-size, var(--font-p-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
}

    p.bold {
        font-family: var(--font-body-copy);
        font-weight: bold;
    }

    p.large {
        --font-size: var(--font-p-large)
    }

    p.subtitle {
        --font-size: var(--font-p-subtitle)
    }

    p.caption {
        --font-size: var(--font-p-caption)
    }

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

a {
    font-size: var(--font-size, var(--font-a-default));
    letter-spacing: calc(var(--font-size, var(--font-a-default)) * -0.02);
    --line-height: 160%;
    --font-family: var(--font-body-copy);
    font-family: var(--font-family);
    line-height: var(--line-height);
}

    a.bold {
        font-weight: 700;
    }

    a.underline {
        text-decoration: underline;
    }

span {
    font-family: var(--font-family, var(--font-body-copy));
    font-weight: normal;
    font-size: var(--font-size, var(--font-span-default));
    line-height: var(--line-height, 160%);
    letter-spacing: calc(var(--font-size, var(--font-span-default)) * -0.02);
}

    span.small-label {
        --font-size: var(--font-label-default);
    }

    span.large-label {
        --font-size: var(----font-span-large-default);
        --line-height: 120%;
    }

label {
    --font-size: var(--font-label-default);
    --font-family: var(--font-body-copy);
    font-weight: bold;
    --line-height: 160%;
    color: rgb(var(--black));
    font-family: var(--font-family);
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size, var(--font-p-default)) * -0.02);
    line-height: var(--line-height);
}

    label.disabled {
        color: rgb(var(--black));
        opacity: 40%;
    }

input {
    font-size: var(--font-size, var(--font-input-default));
    letter-spacing: calc(var(--font-size, var(--font-p-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
    --font-family: var(--font-body-copy);
    font-family: var(--font-family);
}

    input.lg-line-height {
        --line-height: 160%;
    }

textarea {
    --font-family: var(--font-body-copy);
    font-family: var(--font-family);
    line-height: 160%;
    --font-size: 0.875rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size, var(--font-p-default)) * -0.02);
}

.bold_on_hover_fix span::before {
    content: attr(data-title);
    content: attr(data-title) / "";
    display: block;
    font-weight: bold;
    height: 0;
    overflow: hidden;
    pointer-events: none;
    user-select: none;
    visibility: hidden;
}

@media speech {

    .bold_on_hover_fix span::before {
        display: none
    }
}

button {
    background-color: rgb(var(--transparent));
    background-image: none;
    text-transform: none;
    font-family: var(--font-bold);
    font-size: var(--font-size);
    line-height: 160%;
    letter-spacing: calc(var(--font-size) * -0.02);
}

ol,
ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

    ul.chevron-primary {
        display: block;
    }

        ul.chevron-primary li {
            display: block;
            font-family: var(--font-body-copy);
            font-size: var(---font-p-default);
            padding-left: 1.25rem;
            position: relative;
        }

            ul.chevron-primary li::before {
                content: url("data:image/svg+xml; utf8, <svg xmlns='http://www.w3.org/2000/svg' width='9' height='6' viewBox='0 0 9 6' fill='none'>  <path d='M9 3L7.15493e-08 -1.061e-06L0 6L9 3Z' fill='%234FE200'/> </svg>  ");
                display: inline-block;
                left: 0rem;
                position: absolute;
                top: -0.15rem;
            }

audio,
img,
iframe,
canvas,
embed,
object,
svg,
video {
    vertical-align: middle;
}

img,
video {
    max-width: 100%;
    height: auto;
}

[role='button'],
button {
    cursor: pointer;
}

.chevron-icon__svg svg {
    display: inline-block;
    height: 1.25rem;
    margin-right: 0.5rem;
    stroke: currentcolor;
    stroke-width: 2;
    width: 1.25rem;
    vertical-align: middle;
    flex-shrink: 0;
    margin-top: 0.25rem;
}

.chevron-icon__svg__transition {
    transform: translateX(var(--ald-translate-x)) translateY(var(--ald-translate-y)) rotate(var(--ald-rotate)) skewX(var(--ald-skew-x)) skewY(var(--ald-skew-y)) scaleX(var(--ald-scale-x)) scaleY(var(--ald-scale-y));
    transition-duration: 200ms;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.close-icon__svg {
    cursor: pointer;
    z-index: 10;
    color: rgb(var(--white));
}

    .close-icon__svg svg {
        display: inline-block;
        stroke: currentcolor;
        height: 1rem;
        transition: all 0.2s;
        stroke-width: 1;
        width: 1rem;
    }

        .close-icon__svg svg:hover {
            stroke-width: 2;
        }

.menu-bar__button-icon__svg {
    display: inline-block;
    flex: none;
    height: 1.75rem;
    margin-right: 0.5rem;
    stroke: currentcolor;
    stroke-width: 2;
    transition: all 0.2s;
    width: 1.75rem;
    vertical-align: middle;
}

@media (min-width: 380px) {
    .menu-bar__button-icon__svg__mobile {
        margin-right: 0rem;
        height: 1.5rem;
        width: 1.5rem;
    }
}

.menu-bar__button-icon__hide {
    display: none !important;
}

.navigation__mobile__chevron-icon {
    display: inline-block;
    height: 0.75rem;
    stroke: currentColor;
    stroke-width: 2;
    vertical-align: middle;
    transition: all 0.2s;
    width: 0.75rem;
}

.navigation__mobile__chevron-icon__right {
    margin-left: 1.25rem;
}

.navigation__mobile__chevron-icon__left {
    margin-right: 0.625rem;
}

/* This file contains the default classes for handling outline */

/* an override for a TW default. But maybe wise to leave in place and have local class overrides */

.ald-bold {
    --font-family: var(--font-bold);
}

.ald-underline {
    text-decoration: underline;
}

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

.ald-focus:focus {
    outline: 2px solid rgb(var(--teal));
    outline-offset: 2px;
}

.ald-focus__button:focus {
    outline: 2px solid rgb(var(--teal));
    outline-offset: -2px;
}

.ald-hidden {
    display: none;
}

.text-block p,
.text-block h2,
.text-block h3,
.text-block h4,
.text-block ul {
    margin-bottom: 0.75rem;
}

.text-block table {
    margin-bottom: 2rem;
}

.text-block p,
.text-block a {
    font-size: 0.875rem;
}

.text-block a {
    font-weight: bold;
    text-decoration: underline;
}

.text-block .lead-paragraph {
    font-size: 1.125rem;
}

@media screen and (min-width: 768px) {
    .text-block p,
    .text-block a {
        font-size: 1rem;
    }
}

.text-block ul,
.text-block ol {
    display: grid;
    font-family: var(--font-body-copy);
    font-size: var(--font-p-default);
    margin-left: 0.625rem;
    padding-left: 0.5rem;
    row-gap: 0.75rem;
}

.text-block li ul,
.text-block li ol {
    padding-top: 0.5rem;
}

.text-block ul li {
    display: block;
    padding-right: 1.25rem;
    position: relative;
}

    .text-block ul li::before {
        bottom: 0.15rem;
        content: url("data:image/svg+xml; utf8, <svg xmlns='http://www.w3.org/2000/svg' width='9' height='6' viewBox='0 0 9 6' fill='none'>  <path d='M9 3L7.15493e-08 -1.061e-06L0 6L9 3Z' fill='%234FE200'/> </svg>  ");
        display: inline-block;
        margin-right: 0.5rem;
        position: relative;
    }

.text-block ol li {
    font-size: var(--font-size);
    list-style-type: decimal;
}

.group_page.divider__hr {
    border-color: rgba(var(--white), 1);
}

.divider__hr {
    border-top-width: 0.0625rem;
    border-color: rgba(var(--black), 0.2);
    margin-top: 1.25rem;
}

@media screen and (min-width: 640px) {

    .divider__hr {
        margin-top: 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .divider__hr {
        margin-top: 3rem
    }
}

.awards {
    align-items: center;
    display: flex;
    flex-direction: column;
    padding: 2.5rem 1.25rem;
    width: 100%;
}

@media screen and (min-width: 640px) {

    .awards {
        padding: 4rem 2.5rem
    }
}

@media screen and (min-width: 1440px) {

    .awards {
        padding: 5rem 14.75rem
    }
}

.awards ul {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 3rem;
    height: auto;
    justify-content: center;
    list-style-type: none;
    margin-top: 3rem;
}

    .awards ul li {
        height: auto;
        width: auto;
    }

        .awards ul li a {
            cursor: pointer;
        }

.navigation-menu__main-container {
    position: sticky;
    top: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    z-index: 9999;
}

@media screen and (min-width: 1024px) {
    .navigation-menu__main-container {
        position: unset;
        top: unset;
    }
}

.navigation-menu__main-container__group {
    position: relative;
    z-index: 999999;
}

.navigation-menu__top-bar-container {
    background-color: rgb(var(--white));
    align-items: center;
    display: flex;
    gap: 2rem;
    padding-bottom: 1rem;
    padding-top: 1.5rem;
    position: sticky;
    top: 0;
}

.navigation-menu__top-bar-container__group {
    background-color: rgb(var(--group-colour));
    align-items: flex-start;
    display: flex;
    gap: 2rem;
    padding-bottom: 1.875rem;
    padding-top: 1.875rem;
    position: sticky;
    top: 0;
}

@media screen and (min-width: 1024px) {

    .navigation-menu__top-bar-container__group {
        padding-bottom: 0
    }
}

.navigation-menu__top-bar-icon-container {
    display: flex;
    flex: 1 1 auto;
    gap: 2rem;
}

@media screen and (min-width: 640px) {
    .navigation-menu__top-bar-container {
        position: unset;
        top: unset;
    }
}

@media (min-width: 1024px) {
    .navigation-menu__top-bar-container {
        position: unset;
        top: unset;
    }
}

@media (min-width: 1280px) {
    .navigation-menu__top-bar-container {
        position: unset;
        top: unset;
    }
}

@media screen and (min-width: 1440px) {
    .navigation-menu__top-bar-container {
        position: unset;
        top: unset;
    }
}

.navigation-menu__menu-bar-container {
    display: none;
    width: 100%;
}

@media (min-width: 1024px) {
    .navigation-menu__menu-bar-container {
        display: block;
    }
}

.navigation-menu__menu-bar-container_group {
    display: none;
    width: 100%;
}

@media (min-width: 1024px) {
    .navigation-menu__menu-bar-container_group {
        display: block;
    }
}

.navigation-menu__dropdown-container {
    cursor: pointer;
    display: flex;
    gap: 1.5rem;
    list-style-type: none;
}

.navigation-menu__item__group {
    display: flex;
}

    .navigation-menu__item__group span {
        color: rgb(var(--white));
        --font-size: var(--font-p-default);
    }

    .navigation-menu__item__group svg {
        color: rgb(var(--white));
    }

.navigation-menu__logo-container {
    position: sticky;
    top: 0;
    /* align-items: center; */
    display: flex;
    justify-content: flex-start;
}

@media (min-width: 1024px) {
    .navigation-menu__logo-container {
        position: unset;
        top: unset;
    }
}

.navigation-menu-partner__logo-container {
    background-color: rgb(var(--white));
    position: sticky;
    top: 0;
    align-items: center;
    display: flex;
    justify-content: flex-start;
}

@media (min-width: 1024px) {
    .navigation-menu-partner__logo-container {
        position: unset;
        top: unset;
        flex: none;
    }
}

.navigation-menu__logo-link__a {
    align-items: center;
    cursor: pointer;
    display: flex;
    height: 100%;
}

.navigation-menu__logo-link__a__group div {
    display: inline-block;
    width: 15.625rem;
}

.navigation-menu__logo-link__a__group svg {
    height: 2rem;
    width: 8.125rem;
}

.navigation-menu__logo-link__a svg {
    height: 13px;
    width: 97px;
}

@media screen and (min-width: 640px) {
    .navigation-menu__logo-link__a svg {
        height: unset;
        width: unset;
    }
}

.navigation-menu__logo__img > div > svg {
    height: 1rem;
    margin-left: 3rem;
    margin-top: 2rem;
    width: 7.5rem;
}

.navigation-menu__centre-bar-container {
    align-items: center;
    background-color: rgb(var(--light-grey-tint));
    display: none;
    flex: 1 1 auto;
    justify-content: center;
}

@media screen and (min-width: 1024px) {

    .navigation-menu__centre-bar-container {
        display: inline-block
    }
}

.navigation-menu-partner__centre-bar-container {
    align-items: center;
    background-color: rgb(var(--white));
    display: flex;
    flex: 1 1 auto;
    justify-content: flex-start;
}

@media screen and (min-width: 1024px) {
    .navigation-menu-partner__centre-bar-container {
        display: flex;
        max-height: 100%;
    }
}

.navigation-menu-partner__centre-bar-container a img {
    height: 1.75rem;
}

@media screen and (min-width: 1024px) {
    .navigation-menu-partner__centre-bar-container a img {
        height: 1.625rem;
    }
}

.navigation-menu__centre-bar-container__intermediaries {
    background-color: rgb(var(--dark-grey-tint));
    flex: 0 1 auto;
    width: 11rem;
}

.navigation-menu__centre-bar-link__a {
    align-self: center;
    --font-size: 1.125rem;
    text-decoration: none;
}

    .navigation-menu__centre-bar-link__a:hover {
        border-bottom-width: 2px;
        border-color: rgb(var(--aldermore-yellow));
        font-weight: bold;
    }

.navigation-menu__centre-bar-link__a__intermediaries {
    border-bottom-width: 2px;
    border-color: rgb(var(--dark-grey-tint));
    color: rgb(var(--white));
    font-family: var(--font-bold);
    padding-bottom: 0.25rem;
}

.navigation-menu__button-bar-container {
    display: flex;
    flex: none;
    gap: 0.75rem;
    width: fit-content;
}

.navigation-menu__button-bar-container__group {
    display: flex;
    flex: none;
    gap: 0.75rem;
    width: fit-content;
}

    .navigation-menu__button-bar-container__group .navigation__mobile__menu-container-full svg {
        color: rgb(var(--white));
    }

    .navigation-menu__button-bar-container__group svg {
        background-color: rgb(var(--group-colour));
        color: rgb(var(--white));
    }

    .navigation-menu__button-bar-container__group .navigation_ul_recursive {
        background-color: rgb(var(--tonal-green));
    }

        .navigation-menu__button-bar-container__group .navigation_ul_recursive li {
            background-color: rgb(var(--tonal-green));
        }

        .navigation-menu__button-bar-container__group .navigation_ul_recursive svg {
            background-color: rgb(var(--tonal-green));
        }

    .navigation-menu__button-bar-container__group .navigation__mobile__menu-container {
        top: 5.70rem;
    }

.navigation-menu__button-content__container {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
}

@media (min-width: 380px) {
    .navigation-menu__button-content__container {
        flex-direction: column-reverse;
    }
}

@media (min-width: 1024px) {
    .navigation-menu__button-content__container {
        flex-direction: row;
    }
}

.navigation-menu__button {
    align-items: center;
    display: flex;
    font-family: var(--font-body-copy);
    font-weight: bold;
    font-size: var(--font-p-subtitle);
    gap: 0.25rem;
    height: 2.25rem;
    justify-content: center;
    padding: 0 0.75rem 0 0.75rem;
}

    .navigation-menu__button div {
        align-items: center;
        display: flex;
        gap: 0.25rem;
        justify-content: center;
    }

    .navigation-menu__button svg {
        color: rgb(var(--black));
        height: 0.75rem;
        width: 0.75rem;
    }

    .navigation-menu__button span {
        align-items: center;
        font-weight: bold;
    }

@media screen and (min-width: 640px) {

    .navigation-menu__button {
        gap: 0.375rem;
        min-width: 5.625rem;
        padding: 0 1rem 0 1rem
    }
}

.navigation-menu__button.primary {
    color: rgb(var(--black));
    background-color: rgb(var(--primary-colour), 0.8);
}

.navigation-menu__button.secondary {
    color: rgb(var(--white));
    background-color: rgb(var(--black));
    --btn-colour-hover: var(--secondary-colour-hover);
}

    .navigation-menu__button.secondary svg {
        color: rgb(var(--primary-colour));
    }

.navigation-menu__button__visible-desktop-only {
    display: none !important;
}

@media (min-width: 1024px) {
    .navigation-menu__button__visible-desktop-only {
        display: inline-block !important;
    }
}

.navigation-menu__button__black {
    background-color: rgb(var(--black));
    border-color: rgb(var(--black));
    color: rgb(var(--white));
}

    .navigation-menu__button__black:hover {
        color: rgb(var(--black));
    }

.navigation-menu__button__yellow {
    background-color: rgb(var(--aldermore-yellow));
    border-color: rgb(var(--aldermore-yellow));
    color: rgb(var(--black));
}

.navigation-menu__button-caption__span {
    display: none;
    --font-size: 0.625rem;
    margin-top: 0.25rem;
}

@media (min-width: 380px) {
    .navigation-menu__button-caption__span {
        display: inline-block;
    }
}

@media (min-width: 1024px) {
    .navigation-menu__button-caption__span {
        --font-size: 1.125rem;
        margin: 0rem 0.25rem 0rem 0rem;
    }
}

.navigation-menu__dropdown-header {
    width: auto;
}

    .navigation-menu__dropdown-header .highlight div {
        align-items: center;
        display: flex;
        gap: 0.25rem;
    }

        .navigation-menu__dropdown-header .highlight div span {
            flex-shrink: 0;
        }

    .navigation-menu__dropdown-header .highlight:after {
        border-bottom: 2px solid rgb(var(--primary-colour));
        content: '';
        display: block;
        padding-top: 2rem;
        transition: 0.3s;
        width: 0;
    }

    .navigation-menu__dropdown-header div:hover:after {
        width: 100%;
    }

    .navigation-menu__dropdown-header span {
        display: inline-block;
        font-weight: normal;
        transition: font-weight 0.3s;
    }

    .navigation-menu__dropdown-header:hover span {
        font-weight: bold;
    }

.navigation-menu__dropdown__full-container__group {
    background-color: rgb(var(--tonal-green));
    color: rgb(var(--white));
    display: none;
    flex-direction: column;
    height: auto;
    justify-content: space-between;
    position: absolute;
    top: 5.60rem;
    z-index: 20;
}

.navigation-menu__dropdown__full-container {
    background-color: rgb(var(--black));
    color: rgb(var(--white));
    display: none;
    flex-direction: column;
    height: auto;
    justify-content: space-between;
    position: absolute;
    z-index: 20;
}

.navigation-menu__dropdown__show {
    display: flex !important;
}

.navigation-menu__dropdown-section-header__container {
    align-items: center;
    border-bottom-width: 1px;
    border-color: rgba(var(--white), 20%);
    display: flex;
    justify-content: space-between;
    margin-top: 2.5rem;
    margin-bottom: 1.75rem;
    padding-bottom: 1.75rem;
    width: auto;
}

.navigation-menu__dropdown-menus__container {
    display: flex;
    height: auto;
    gap: 2rem;
    width: auto;
}

.navigation-menu__dropdown-menus__container__group {
    display: flex;
    height: auto;
    gap: 2rem;
    justify-content: space-between;
    width: auto;
}

.navigation-menu__dropdown-single-menu__container {
    display: flex;
    flex-direction: column;
}

.navigation-menu__dropdown-single-menu__item {
    margin-bottom: 0.75rem;
}

    .navigation-menu__dropdown-single-menu__item:first-child {
        margin-bottom: 1.25rem;
    }

    .navigation-menu__dropdown-single-menu__item:last-child {
        margin-bottom: 1.75rem;
    }

.navigation-menu__dropdown-single-menu__transition {
    transform: translateX(var(--ald-translate-x)) translateY(var(--ald-translate-y)) rotate(var(--ald-rotate)) skewX(var(--ald-skew-x)) skewY(var(--ald-skew-y)) scaleX(var(--ald-scale-x)) scaleY(var(--ald-scale-y));
    transition-duration: 200ms;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

    .navigation-menu__dropdown-single-menu__transition:hover {
        --ald-translate-x: 0.75rem;
    }

.navigation__menu-item__link {
    background-color: rgb(var(--transparent));
    color: rgb(var(--white));
    display: inline-flex;
    flex-direction: row-reverse;
    justify-content: center;
    padding-bottom: 0.125rem;
    padding-right: 0.5rem;
    padding-top: 0.125rem;
    place-items: center;
    text-align: left;
    text-decoration: none;
    align-items: flex-start;
}

@media (min-width: 768px) {
    .navigation__menu-item__link {
        --font-size: 1.125rem;
    }
}

.navigation__menu-item__link:active {
    font-weight: bold;
}

.navigation__menu-item__link:hover {
    font-weight: bold;
}

.navigation__menu-item__span {
    border-bottom-width: 2px;
    border-color: rgb(var(--black));
    font-family: var(--font-book);
    --font-size: 0.875rem;
}

@media (min-width: 768px) {
    .navigation__menu-item__span {
        --font-size: 1.125rem;
    }
}

.navigation__menu-item__span:hover {
    border-color: rgb(var(--aldermore-yellow));
}

.clicked-nav svg {
    transform: rotate(180deg);
}

.clicked-nav span {
    font-weight: bold;
}

.clicked-nav div:after {
    width: 100%;
}

.section-header {
    border: 2px solid black;
    --font-family: var(--font-bold);
    --font-size: 1.125rem;
    margin-left: -6px;
    margin-top: -6px;
    padding: 4px;
}

    .section-header:hover {
        border-bottom: 2px solid #ffcd00;
    }

.navigation__mobile__menu-container-full {
    align-items: center;
    cursor: pointer;
    display: flex;
}

@media (min-width: 1024px) {
    .navigation__mobile__menu-container-full {
        display: none;
    }
}

.navigation__mobile__sub-menu-container {
    background-color: rgb(var(--white));
    color: rgb(var(--black));
    flex-direction: column;
    height: 100%;
}

.navigation__mobile__sub-menu-container__intermediaries {
    background-color: rgb(var(--dark-grey-tint));
    color: rgb(var(--white));
}

.navigation__mobile__hamburger-menu__button {
    color: rgb(var(--black));
    display: inline-block;
    height: fit-content;
    justify-content: center;
    width: fit-content;
    margin-left: 1rem;
}

@media screen and (min-width: 640px) {
    .navigation__mobile__hamburger-menu__button {
        margin-left: 1.5rem;
    }
}

@media (min-width: 1024px) {
    .navigation__mobile__hamburger-menu__button {
        height: auto;
        --font-size: 1.125rem;
        padding: 1.5rem 1.5rem 1.25rem 1.5rem;
        width: auto;
    }
}

.navigation__mobile__hamburger-menu__caption-container {
    align-items: center;
    display: flex;
    flex-direction: column-reverse;
}

.navigation__mobile__hamburger-menu__caption_span {
    display: none;
    --font-size: 0.625rem;
    margin-top: 0.25rem;
}

@media (min-width: 380px) {
    .navigation__mobile__hamburger-menu__caption_span {
        display: inline-block;
    }
}

.navigation__mobile__menu-container {
    background-color: rgb(var(--black));
    color: rgb(var(--white));
    left: 0px;
    position: absolute;
    top: 4.70rem;
    width: 100%;
    z-index: 20;
}

.navigation__mobile__menu-container__hide {
    display: none;
}

.navigation__mobile__menu-item__li {
    align-items: flex-start;
    background-color: rgb(var(--black));
    border-bottom: 1px solid rgba(var(--white), 0.2);
    display: flex;
    margin-left: 1.25rem;
    margin-right: 1.25rem;
    padding-bottom: 1.25rem;
    padding-top: 1.25rem;
}

@media screen and (min-width: 640px) {
    .navigation__mobile__menu-item__li {
        margin-left: 2.5rem;
        margin-right: 2.5rem;
    }
}

.navigation_ul_recursive {
    padding-top: 2.5rem;
}

    .navigation_ul_recursive .navigation__mobile__menu-item__li:first-child {
        padding-top: 0;
    }

    .navigation_ul_recursive.subnav-open {
        padding-top: 0;
    }

.navigation__mobile__menu-item__transition {
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
}

.navigation__mobile__menu-heading {
    align-items: center;
    color: rgb(var(--primary-colour));
    display: flex;
    --font-size: 0.875rem;
    justify-content: space-between;
    width: 100%;
}

    .navigation__mobile__menu-heading span {
        font-weight: 700;
    }

    .navigation__mobile__menu-heading:hover {
        cursor: default;
    }

.navigation__mobile__menu-item__base {
    align-items: flex-start;
    cursor: pointer;
    display: flex;
    --font-size: 0.875rem;
    height: 100%;
    width: 100%;
    color: rgb(var(--white));
}

    .navigation__mobile__menu-item__base span {
        font-weight: 700;
    }

.navigation__mobile__menu-item__button {
    border-color: rgb(var(--black));
    justify-content: space-between;
}

.navigation-menu__button-bar-container__group .navigation__mobile__menu-item__link {
    color: rgb(var(--white));
}

.navigation__mobile__menu-item__link {
    border-color: rgb(var(--white));
    --font-family: var(--font-bold);
    justify-content: space-between;
    color: rgb(var(--black));
}

.navigation__mobile__menu-item__help-link {
    border-color: rgb(var(--black));
    --font-family: var(--font-bold);
    justify-content: space-between;
}

.navigation__mobile__menu-item__link__intermediaries {
    border-color: rgb(var(--dark-grey-tint));
}

.navigation-menu__button-bar-container__group .navigation__mobile__sub-menu__base {
    border-color: rgba(var(--white), 20%);
}

.navigation__mobile__sub-menu__base {
    align-items: center;
    border-bottom-width: 1px;
    border-color: rgba(var(--black), 20%);
    display: flex;
    justify-content: flex-start;
    margin-left: 1.25rem;
    margin-right: 1.25rem;
    padding-bottom: 1.25rem;
    padding-top: 1.25rem;
}

@media screen and (min-width: 640px) {
    .navigation__mobile__sub-menu__base {
        margin-left: 2.5rem;
        margin-right: 2.5rem;
    }
}

.navigation__mobile__sub-menu-heading {
    background-color: rgb(var(--black));
    border-bottom-width: 3px;
    border-color: rgb(var(--primary-colour));
    color: rgb(var(--white));
    margin-left: 0;
    margin-right: 0;
}

button.subnav-button > span,
button.submenu-button > span {
    color: rgb(var(--white));
    overflow: hidden;
}

.subnav-link > span,
.submenu-link > span {
    overflow: hidden;
}

.subnav-link.navigation__mobile__menu-item__link__intermediaries > span {
    border-bottom: 2px solid rgb(var(--dark-grey-tint));
    color: rgb(var(--white));
}

.subnav-link.navigation__mobile__menu-item__link__intermediaries:hover > span {
    border-bottom: 2px solid rgb(var(--aldermore-yellow));
}

.subnav-link.navigation__mobile__menu-item__link__intermediaries > svg {
    stroke: rgb(var(--white));
}

.subnav {
    position: absolute;
    top: 0px;
    left: 100%;
    transition: all;
    width: 0px;
    overflow: hidden;
}

.subnav-open {
    left: 0px;
    width: 100%;
}

.is-intermediaries a span {
    border-bottom: 2px solid #4b4f50;
}

#Mobile_Nav_Button svg path {
    stroke: white;
}

#Mobile_Nav_Button:hover svg path {
    stroke: black;
}

.nav-dropdown-width {
    width: 89%;
}

.mobile-nav-dropdown-width {
    width: 94%;
}

.navigation-menu-chevron {
    flex-shrink: 0;
    height: 1rem;
    transition: all 0.2s;
    width: 1rem;
}

.navigation-menu-chevron__rotate {
    transform: rotate(180deg);
}

.navigation-menu-close__icon:hover {
    color: rgb(var(--aldermore-yellow));
}

.cta-btn {
    align-items: center;
    display: flex;
    font-family: var(--font-body-copy);
    font-weight: bold;
    font-size: var(--font-p-subtitle);
    gap: 0.375rem;
    height: 2.25rem;
    justify-content: center;
    min-width: 5.625rem;
    padding: 0 1rem;
    /* 
    This is needed as if the class is used on an anchor tag, the anchor will be default occupy all space
    whereas the button will not.
   */
    width: fit-content;
}

.cta-btn-background {
    --btn-colour-hover: var(--primary-colour-hover);
    background-image: linear-gradient(135deg, rgb(var(--btn-colour-hover)) 50%, transparent 51%);
    /* some initial size to get the slanted appearance */
    background-position: -6.25rem -6.25rem;
    /* negative positioning to hide it initially */
    background-repeat: no-repeat;
    background-size: 0.25rem 17.25rem;
    transition: all ease 0.5s;
}

.cta-btn:disabled {
    opacity: 0.4;
    pointer-events: none;
}

.cta-btn:hover {
    /* 200% because gradient is colored only for 50% */
    background-position: 0rem 0rem;
    background-size: 200% 200%;
}

.cta-btn-background:hover {
    /* 200% because gradient is colored only for 50% */
    background-position: 0rem 0rem;
    background-size: 200% 200%;
}

.cta-btn div {
    display: flex;
    justify-content: center;
}

.cta-btn .left-icon {
    align-items: center;
    padding-right: 0.25rem;
}

.cta-btn .right-icon {
    align-items: center;
    padding-left: 0.25rem;
}

.cta-btn svg {
    color: rgb(var(--black));
    display: flex;
    height: 0.75rem;
    width: 0.75rem;
}

.cta-btn-primary {
    color: rgb(var(--black));
    background-color: rgb(var(--primary-colour));
}

    .cta-btn-primary:active {
        background: rgb(var(--primary-colour-pressed));
    }

.cta-btn-black {
    color: rgb(var(--white));
    background-color: rgb(var(--black));
    --btn-colour-hover: var(--secondary-colour-hover);
}

    .cta-btn-black:active {
        background: rgb(var(--secondary-colour-pressed));
        outline: 0.0625rem solid rgb(var(--black));
    }

    .cta-btn-black svg {
        color: rgb(var(--primary-colour));
    }

.cta-btn-white {
    color: rgb(var(--black));
    background-color: rgb(var(--white));
    --btn-colour-hover: var(--secondary-light-colour-hover);
    outline: 0.0625rem solid rgb(var(--black));
}

    .cta-btn-white:active {
        background: rgb(var(--secondary-light-colour-pressed));
    }

.cta-chip {
    align-items: center;
    background: rgb(var(--grey-light));
    border: 0.0625rem solid rgb(var(--black), 0.1);
    border-radius: 2rem;
    color: rgb(var(--black));
    cursor: pointer;
    display: flex;
    font-family: var(--font-body-copy);
    --font-size: var(--font-p-caption);
    gap: 0.5rem;
    height: 2.25rem;
    justify-content: center;
    padding: 0.75rem;
    width: fit-content;
}

    .cta-chip svg {
        display: flex;
        flex-shrink: 0;
        height: 0.75rem;
        width: 0.75rem;
    }

    .cta-chip:hover {
        border: 0.0625rem solid rgb(var(--black));
    }

    .cta-chip:active {
        background: rgb(var(--black));
        color: rgb(var(--primary-colour));
    }

        .cta-chip:active span {
            color: rgb(var(--white));
            font-weight: bold;
        }

    .cta-chip:disabled {
        opacity: 0.4;
        pointer-events: none;
    }

.cta-chip-icon {
    width: 2.25rem;
}

.cta-banner {
    align-items: baseline;
    background-color: rgb(var(--primary-colour));
    color: rgb(var(--black));
    cursor: pointer;
    display: flex;
    font-weight: bold;
    --font-size: 1.25rem;
    padding-bottom: 2rem;
    padding-top: 2rem;
}

    .cta-banner:active {
        background-color: rgb(var(--primary-colour-pressed));
    }

    .cta-banner:hover {
        text-decoration: underline;
    }

@media screen and (min-width: 641px) {

    .cta-banner {
        justify-content: center
    }
}

.cta-banner svg {
    display: flex;
    align-items: flex-start;
    flex-shrink: 0;
    height: 0.75rem;
    margin-left: 0.5rem;
    width: 0.75rem;
}

.disabled {
    opacity: 0.4;
    pointer-events: none;
}

.cta-banner-black {
    background-color: rgb(var(--black));
    --btn-colour-hover: var(--secondary-colour-hover);
    color: rgb(var(--white));
}

    .cta-banner-black:active {
        background-color: rgb(var(--secondary-colour-pressed));
    }

    .cta-banner-black svg {
        color: rgb(var(--primary-colour));
    }

.cta-banner-white {
    background-color: rgb(var(--white));
    --btn-colour-hover: var(--secondary-light-colour-hover);
}

    .cta-banner-white:active {
        background-color: rgb(var(--secondary-light-colour-pressed));
    }

.ald-cta-load-more {
    padding: 0.75rem 4rem;
    font-family: var(--font-bold);
    --font-size: 1.125rem;
    line-height: 160%;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    background-color: rgb(var(--aldermore-yellow));
}

    .ald-cta-load-more:active {
        background-color: rgb(var(--black));
        color: rgb(var(--white));
        text-decoration: none;
    }

.cta_quick_link {
    align-items: flex-start;
    background-color: rgb(var(--transparent));
    cursor: pointer;
    display: flex;
    font-family: var(--font-body-copy);
    font-size: var(--font-p-default);
    gap: 0.25rem;
    transition: font-weight 0.3s;
    width: fit-content;
}

    .cta_quick_link svg {
        flex-shrink: 0;
        height: 0.75rem;
        margin-top: 0.3rem;
        width: 0.75rem;
    }

.cta_quick_link__group svg {
    color: rgb(var(--primary-colour));
}

.disabled {
    opacity: 0.4;
    pointer-events: none;
}

.cta_quick_link span {
    display: inline-block;
    --font-size: var(--font-p-default);
    font-weight: normal;
    transition: font-weight 0.3s;
}

.cta_quick_link:hover span {
    font-weight: bold;
    text-decoration: underline;
}

.cta_quick_link_nav {
    background-color: rgb(var(--transparent));
    color: rgb(var(--black));
    cursor: pointer;
    display: inline-block;
    --font-family: var(--font-body-copy);
    --font-size: var(--font-p-default);
    font-weight: normal;
    padding-top: 0.5rem;
    width: fit-content;
}

    .cta_quick_link_nav svg {
        height: 0.75rem;
        width: 0.75rem;
    }

.cta_quick_link_nav__content {
    gap: 0.25rem;
}

    .cta_quick_link_nav__content span {
        display: inline-block;
        font-weight: normal;
        transition: font-weight 0.3s;
    }

    .cta_quick_link_nav__content:hover span {
        font-weight: bold;
    }

.cta_quick_link_nav:after {
    border-bottom: 2px solid rgb(var(--primary-colour));
    content: '';
    display: block;
    transition: width 0.3s, font-weight 0.3s;
    width: 0;
}

.cta_quick_link_nav:hover:after {
    width: 100%;
}

.disabled {
    opacity: 0.4;
    pointer-events: none;
}

.cta_quick_link_nav.active span {
    font-weight: 700;
}

.cta_quick_link_nav.active:after {
    width: 100%;
}

.cta_textlink {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.25rem;
    cursor: pointer;
    --font-size: var(--font-p-default);
}

    .cta_textlink span {
        font-weight: normal;
        transition: font-weight 0.3s;
    }

    .cta_textlink:hover span {
        text-decoration: underline;
        font-weight: bold;
    }

    .cta_textlink:focus {
        text-decoration: underline;
    }

    .cta_textlink svg {
        display: inline-block;
        height: 1.25rem;
        margin-right: 0.25rem;
        margin-left: 0.625rem;
        stroke: currentcolor;
        stroke-width: 3;
        width: 1.25rem;
        vertical-align: middle;
        transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1);
    }

    .cta_textlink:hover svg {
        transform: translateX(0.625rem);
    }

@media screen and (min-width: 768px) {
    .ald_cta_textlink {
        font-size: 1rem;
    }
}

.cta_textlink__grid {
    color: rgb(var(--black));
    --font-family: var(--font-body-copy);
    display: grid;
    justify-content: space-between;
    width: 100%;
    gap: 1rem;
    grid-template-columns: 1fr 1rem;
    text-align: left;
    --font-size: var(--font-p-default);
    padding-right: 1.25rem;
}

@media screen and (min-width: 768px) {

    .cta_textlink__grid {
        padding-right: 2rem
    }
}

.cta_textlink__grid svg {
    height: 1rem;
    stroke-width: 1;
    width: 1rem;
}

.ald_cta_textlink_white {
    color: rgb(var(--white));
}

.ald-cta-titlelink {
    display: flex;
    flex-direction: row;
    padding: 0.25rem 0.375rem;
    text-align: left;
    --font-family: var(--font-light);
    color: rgb(var(--black));
    background-color: rgb(var(--white));
    min-width: 7rem;
    max-width: 18.43rem;
    max-height: 6rem;
    --font-size: 1.875rem;
}

    .ald-cta-titlelink:hover {
        text-decoration: underline;
    }

    .ald-cta-titlelink:active {
        text-decoration: underline;
    }

    .ald-cta-titlelink:focus {
        text-decoration: underline;
        color: rgb(var(--black));
        background-color: rgb(var(--white));
    }

    .ald-cta-titlelink svg {
        height: 2.25rem;
        width: 2.25rem;
        align-self: flex-end;
        stroke: currentcolor;
        color: rgb(var(--black));
        transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1);
    }

    .ald-cta-titlelink:hover svg {
        transform: translateX(0.625rem);
    }

    .ald-cta-titlelink:active svg {
        transform: translateX(0.625rem);
    }

.cta-angled {
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgb(var(--black));
    background-color: rgb(var(--aldermore-yellow));
    --font-family: var(--font-bold);
    --font-size: 1.125rem;
    transition: clip-path 200ms cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    clip-path: polygon(4% 30%, 100% 10%, 100% 100%, 6.5% 100%);
}

    .cta-angled:hover,
    .cta-angled active {
        clip-path: polygon(0% 30%, 100% 0%, 100% 100%, 3.5% 100%);
    }

    .cta-angled:active {
        background-color: rgb(var(--black));
        color: rgb(var(--white));
    }

    .cta-angled div {
        margin-top: 1.5rem;
    }

    .cta-angled:focus div {
        outline: 2px solid rgb(var(--teal));
        outline-offset: -2px;
    }

    .cta-angled svg {
        display: inline-block;
        height: 1.25rem;
        width: 1.25rem;
        stroke: currentcolor;
        margin-right: 0.625rem;
        transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1);
    }

    .cta-angled:hover svg {
        transform: translateX(0.625rem);
    }

    .cta-angled:active svg {
        transform: translateX(0.625rem);
    }

.cta-angled-full {
    height: 5rem;
    padding-left: 1.25rem;
    width: 15.625rem;
}

@media screen and (min-width: 640px) {

    .cta-angled-full {
        height: 6rem;
        padding-left: 1.5rem;
        width: 18rem
    }
}

.cta-angled-reduced {
    height: 3.75rem;
    width: 10.625rem;
    padding-left: 1.5rem;
    align-content: space-evenly;
}

@media screen and (min-width: 640px) {

    .cta-angled-reduced {
        height: 5rem;
        width: 15.625rem
    }
}

.table_product_summary {
    overflow-x: auto;
}

.table_product_summary__table {
    border: 0.0625rem solid rgba(var(--black), 0.2);
    width: 100%;
}

.table_product_summary__table_body {
    background-color: rgb(var(--white));
    width: 100%;
}

.table_product_summary__table_body_row {
    background-color: rgb(var(--white));
    display: flex;
    justify-content: flex-start;
    width: 100%;
}

    .table_product_summary__table_body_row:last-child {
        border-bottom-width: 0rem;
    }

.table_product_summary__table tr:nth-child(odd) {
    background-color: rgb(var(--grey-light));
}

.table_product_summary_double_access .table-product-summary__table-header {
    width: 0;
}

.table_product_summary_double_access table {
    border-spacing: 0rem;
}

    .table_product_summary_double_access table .table-product-summary__table-header {
        background-color: rgb(var(--white));
        border-bottom: 0.0625rem solid rgba(var(--black), 0.2);
    }

.table-product-summary__table-header {
    color: rgb(var(--black));
    font-family: var(--font-body-copy);
    --font-size: 1rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    line-height: 160%; /* 25.6px */
    min-width: 9.375rem;
    --padding: 1rem;
    padding: var(--padding);
    text-align: left;
    width: 100%;
}

@media screen and (min-width: 768px) {

    .table-product-summary__table-header {
        --font-size: 1rem;
        min-width: 12.5rem;
        --padding: 1rem
    }
}

.table-product-summary__table-data {
    color: rgb(var(--black));
    flex-grow: 1;
    font-family: var(--font-body-copy);
    --font-size: 1rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    line-height: 160%;
    min-width: 9.375rem;
    padding: 1rem;
    text-align: end;
}

@media screen and (min-width: 768px) {

    .table-product-summary__table-data {
        --font-size: 1rem;
        min-width: 12.5rem;
        padding: 1rem
    }
}

.table_product_summary_double_access .table-product-summary__table-data__horizontal {
    width: 0;
}

.table_product_summary_double_access tr:nth-child(odd) {
    border-bottom: 0.0625rem solid rgba(var(--black), 0.2);
}

.table-product-summary__table-data__horizontal {
    color: rgb(var(--black));
    flex-grow: 1;
    font-family: var(--font-body-copy);
    --font-size: 1rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    line-height: 160%;
    min-width: 9.375rem;
    padding: 1rem 1.375rem 1rem 1rem;
    width: 100%;
}

@media screen and (min-width: 768px) {

    .table-product-summary__table-data__horizontal {
        --font-size: 1rem;
        min-width: 12.5rem;
        padding: 1rem 1.125rem 1rem 1rem
    }
}

@media screen and (min-width: 1024px) {

    .table-product-summary__table-data__horizontal {
        padding: 1rem
    }
}

.table-product-summary__table-data__horizontal.clear-border {
    border-right: 0.0625rem solid transparent;
}

    .table-product-summary__table-data__horizontal.clear-border.clear-bottom {
        border-bottom: 0rem;
    }

.table_product_summary_double_access tr td:last-child {
    border-right: 0rem;
}

.table_product_summary_double_access tr:last-child td {
    border-bottom: 0rem;
}

/* Styles for Tickbox/Checkbox */

.tickbox__label {
    --font-family: var(--font-body-copy);
    --font-size: 0.875rem;
    font-weight: normal;
    align-self: center;
    display: inline-block;
    margin-left: 0.5rem;
    word-break: break-word;
}

.tickbox-filter__label {
    margin-left: 0rem;
}

    .tickbox-filter__label:has(>input:checked) span {
        font-weight: bold;
        transition: ease-in-out 0.3s;
    }

    .tickbox-filter__label:has(>input:disabled) {
        color: rgba(var(--black), 40%);
    }

.blog-quote-container__full {
    align-items: center;
    display: flex;
    flex-direction: column;
    overflow-y: hidden;
    text-overflow: ellipsis;
}

.blog-quote-container {
    margin-top: 2.5rem;
    margin-bottom: 2.5rem;
    width: 100%;
}

@media (min-width: 640px) {
    .blog-quote-container {
        margin-top: 3rem;
        margin-bottom: 3rem;
    }
}

@media (min-width: 1024px) {
    .blog-quote-container {
        height: auto;
        margin-top: 4rem;
        margin-bottom: 4rem;
        width: 42rem;
    }
}

.bloq-quote__quote {
    margin-bottom: 1rem;
}

.blog-quote__divider {
    border-top-width: 0.125rem;
    margin-bottom: 1rem;
    width: 4.875rem;
}

.blog-quote__author {
    margin-bottom: 1rem;
}

.alert-hidden {
    display: none !important;
}

.alert-text p {
    --font-size: 1rem;
    margin-left: 1rem;
    margin-right: 1rem;
}

.alert-text a {
    text-decoration: underline;
    font-weight: bold;
}

.alert-text.collapsed {
    overflow: hidden;
    max-height: 1.5rem;
}

    .alert-text.collapsed p {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

input[type="date"] {
    appearance: none;
    background: rgb(var(--white));
    color: rgb(var(--black));
    -moz-appearance: none;
    -webkit-appearance: none;
}

.form-control {
    position: relative;
}

    .form-control input, .form-control textarea, .form-control select {
        height: 3rem;
        width: 17.875rem;
        border: 1px solid rgba(var(--black), 0.2);
        color: rgb(var(--black));
        display: block;
        font-family: var(--font-body-copy);
        padding: 1rem;
        padding-right: 2.5rem;
    }

        .form-control input:disabled, .form-control textarea:disabled, .form-control select:disabled {
            background-color: rgb(var(--grey-light));
            color: rgb(var(--black));
            opacity: 40%;
        }

    .form-control input, .form-control textarea {
        background-color: rgb(var(--grey-light));
    }

    .form-control textarea {
        height: 7.75rem;
    }

.form-control__error {
    border-color: rgb(var(--state-error));
}

    .form-control__error input {
        border-color: rgb(var(--state-error));
        background-color: rgb(var(--white));
    }

    .form-control__error textarea {
        border-color: rgb(var(--state-error));
        background-color: rgb(var(--white));
    }

    .form-control__error select {
        border-color: rgb(var(--state-error));
    }

.form-control-error__p {
    --font-family: var(--font-body-copy);
    font-weight: bold;
    margin-left: 0.25rem;
    color: rgb(var(--state-error));
}

.form-control-info__p {
    --font-family: var(--font-body-copy);
    font-weight: bold;
    margin-left: 0.25rem;
    color: rgb(var(--state-info));
}

.form-control__label-container {
    display: flex;
    align-items: center;
    gap: 0;
    min-height: 3.375rem;
    padding-bottom: 0.5rem;
    width: 17.875rem;
}

.form-control__label {
    display: inline-block;
    vertical-align: top;
    cursor: pointer;
}

.form-control__input-textfield {
    --font-size: 0.875rem;
}

.form-control__input-numeric {
    --font-family: var(--font-bold);
    --font-size: 1.6rem;
}

@media screen and (min-width: 768px) {

    .form-control__input-numeric {
        --font-size: 2.25rem
    }
}

.form-control-notification__label {
    padding-left: 0.5rem;
    padding-top: 0.25rem;
}

@media screen and (min-width: 768px) {

    .form-control-notification__label {
        padding-top: 0.5rem
    }
}

.form-info {
    margin-top: 0.5rem;
    display: flex;
    align-items: center;
    width: 20rem;
}

    .form-info svg {
        align-self: flex-start;
        flex-shrink: 0;
        height: 0.75rem;
        margin-top: 0.2rem;
        width: 0.75rem;
    }

    .form-info p {
        overflow: hidden;
    }

.form-error {
    margin-top: 0.5rem;
    display: flex;
    align-items: center;
    width: 17.875rem;
}

    .form-error svg {
        align-self: flex-start;
        flex-shrink: 0;
        height: 0.75rem;
        margin-top: 0.125rem;
        width: 0.75rem;
    }

    .form-error p {
        overflow: hidden;
    }

.form-error__extra {
    margin-top: 1.25rem;
}

.multiselect-box {
    /* padding: 2px 5px 0px 5px; */

    border: 1px solid rgba(var(--black), 0.2);
    background-color: rgb(var(--grey-light));
    position: relative;
    background-image: url('data:image/svg+xml; utf8, <svg viewBox="0 0 16 16" fill="black" stroke="%2365696B" stroke-width="1" xmlns="http://www.w3.org/2000/svg"><path d="M8 12L12 4H4L8 12Z" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/></svg> ');
    background-repeat: no-repeat;
    background-position: right .75rem center;
    background-size: 16px 12px;
    border: 1px solid rgba(var(--black), 0.2);
    max-width: 286px;
}

.mutliselectdropdown {
    height: 3rem;
    width: 17.775rem;
}

.select--error select {
    border-color: rgb(var(--form-red));
}

.multiselect {
    position: relative;
}

.multiselectlist {
    background-color: rgb(var(--grey-light));
    border: 1px solid rgba(var(--black), 0.2);
    border-top: none;
    display: flex;
    flex-direction: column;
    height: 12rem;
    overflow-y: scroll;
    position: absolute;
    width: 100%;
    z-index: 20;
}

@media screen and (min-width: 640px) {

    .multiselectlist {
        width: 17.87rem
    }
}

.multiselectlist.hidden {
    display: none;
}

.multiselectlist__item {
    display: flex;
    padding-left: 1rem;
}

    .multiselectlist__item:hover {
        background-color: white;
    }

        .multiselectlist__item:hover .checkbox-container input[type="checkbox"] {
            --border: var(--primary-colour);
        }

.form-control-option__radio-button {
    appearance: none;
    display: flex;
    cursor: pointer;
    /* margin: 0.25rem; */
    vertical-align: middle;
}

.form-control-option__label {
    --font-family: var(--font-body-copy);
    --font-size: 0.875rem;
    align-self: center;
    display: inline-block;
    font-weight: normal;
    text-transform: capitalize;
    word-break: break-word;
}

.form-control-option__container {
    align-items: center;
    display: flex;
    padding-top: 0.75rem;
    min-width: 20rem;
    max-width: 23rem;
}

    .form-control-option__container:first-child {
        padding-top: 1.25rem;
    }

/* CSS for column layout for form controls */

.form-control__section__grid-1 {
    display: grid;
    justify-content: start;
    --r_gap: 1rem;
    --c_gap: 1.25rem;
    row-gap: var(--r_gap);
    column-gap: var(--c_gap);
}

@media screen and (min-width: 640px) {
    .form-control__section__grid-1 {
        --c_gap: 2.5rem;
    }
}

.form-control__section__grid-2 {
    display: grid;
    justify-content: start;
    --r_gap: 1rem;
    --c_gap: 1.25rem;
    row-gap: var(--r_gap);
    column-gap: var(--c_gap);
}

@media (min-width: 640px) {
    .form-control__section__grid-2 {
        --c_gap: 2.5rem;
        --r_gap: 1rem;
    }
}

@media (min-width: 1024px) {
    .form-control__section__grid-2 {
        grid-auto-flow: column;
    }

        .form-control__section__grid-2 div:nth-child(2n + 1) {
            grid-column: 1;
        }

        .form-control__section__grid-2 div:nth-child(2n + 2) {
            grid-column: 2;
        }
}

.form-control__section__grid-3 {
    display: grid;
    justify-content: start;
    --r_gap: 1rem;
    --c_gap: 1.25rem;
    row-gap: var(--r_gap);
    column-gap: var(--c_gap);
}

@media (min-width: 640px) {
    .form-control__section__grid-3 {
        --c_gap: 2.5rem;
        --r_gap: 1rem;
    }
}

@media (min-width: 1024px) {
    .form-control__section__grid-3 {
        grid-auto-flow: column;
    }

        .form-control__section__grid-3 div:nth-child(2n + 1) {
            grid-column: 1;
        }

        .form-control__section__grid-3 div:nth-child(2n + 2) {
            grid-column: 2;
        }
}

@media screen and (min-width: 1280px) {
    .form-control__section__grid-3 {
        grid-auto-flow: column;
    }

        .form-control__section__grid-3 div:nth-child(3n + 1) {
            grid-column: 1;
        }

        .form-control__section__grid-3 div:nth-child(3n + 2) {
            grid-column: 2;
        }

        .form-control__section__grid-3 div:nth-child(3n + 3) {
            grid-column: 3;
        }
}

@media (min-width: 1024px) {
    .form-control__section__grid-2 .ang-input:nth-child(2n + 1) {
        grid-column: 1;
    }

    .form-control__section__grid-2 .ang-input:nth-child(2n + 2) {
        grid-column: 2;
    }
}

@media (min-width: 1024px) {
    .form-control__section__grid-3 .ang-input:nth-child(2n + 1) {
        grid-column: 1;
    }

    .form-control__section__grid-3 .ang-input:nth-child(2n + 2) {
        grid-column: 2;
    }
}

@media screen and (min-width: 1280px) {
    .form-control__section__grid-3 .ang-input:nth-child(3n + 1) {
        grid-column: 1;
    }

    .form-control__section__grid-3 .ang-input:nth-child(3n + 2) {
        grid-column: 2;
    }

    .form-control__section__grid-3 .ang-input:nth-child(3n + 3) {
        grid-column: 3;
    }
}

/* Download Card */

.card-download {
    display: flex;
    flex-direction: column;
    padding: 1.25rem;
    padding-bottom: 2.5rem;
    width: 18.75rem;
    height: 12.5rem;
}

.card-download__content {
    height: auto;
    overflow-wrap: break-word;
}

.card-download-text {
    width: 18.75rem;
    height: 18.875rem;
}

.card-download__a {
    align-items: center;
    cursor: pointer;
    display: flex;
    gap: 0.25rem;
    width: fit-content;
}

    .card-download__a svg {
        height: 1rem;
        width: 1rem;
    }

.card-download__p {
    margin-top: 1.5rem;
}

/* Card Download Group */

.card-download-group {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
}

@media screen and (min-width: 768px) {

    .card-download-group {
        gap: 1.75rem
    }
}

.card-download-group li {
    list-style-type: none;
}

.download--card-text-button {
    margin-top: 2rem;
    font-weight: bold;
}

.contact-card {
    align-items: flex-start;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    flex-shrink: 0rem;
    height: 12.5rem;
    padding: 1.25rem 1.25rem 2.5rem 1.25rem;
    width: 18.75rem;
}

.contact-card-no-link {
    cursor: none;
    pointer-events: none;
}

.contact-card svg {
    display: flex;
    flex-shrink: 0;
    height: 1.5rem;
    margin-bottom: 1.25rem;
    width: 1.5rem;
}

.contact-card-type__container {
    width: 100%;
}

.contact-card-anchor-text {
    --font-family: var(--font-body-copy);
    font-weight: bold;
    font-family: var(--font-family);
    --font-size: var(--font-h6-default);
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (min-width: 640px) {

    .contact-card-anchor-text {
        --font-size: var(--font-h6-medium)
    }
}

@media (min-width: 1024px) {

    .contact-card-anchor-text {
        --font-size: var(--font-h6-large)
    }
}

.contact-card__a {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.contact-card-copy {
    --font-size: var(--font-p-default)
}

.contact-card-group {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    margin-top: 1.25rem;
}

@media screen and (min-width: 768px) {

    .contact-card-group {
        gap: 1.75rem;
        margin-top: 1.75rem
    }
}

.contact-card-group li {
    list-style-type: none;
}

/*  */

.accordion-alert {
    align-items: center;
    cursor: pointer;
    display: flex;
    font-family: var(--font-body-copy);
    justify-content: space-between;
    max-height: 1000px;
    padding: 1.25rem;
    transition: max-height 0.2s;
    width: 100%;
}

@media screen and (min-width: 640px) {

    .accordion-alert {
        padding-left: 2.25rem;
        padding-right: 2.25rem
    }
}

@media screen and (min-width: 1280px) {

    .accordion-alert {
        padding-left: 3rem;
        padding-right: 3rem
    }
}

.accordion-alert .alert-bell {
    align-self: flex-start;
    display: flex;
}

.accordion-alert svg {
    height: 1.5rem;
    width: 1.5em;
}

.accordion-alert .state-valid svg {
    color: rgb(var(--primary-colour));
}

.accordion-alert .state-info svg {
    color: rgb(var(--state-info));
}

.accordion-alert .alert-chevron {
    align-self: flex-start;
    display: grid;
}

    .accordion-alert .alert-chevron svg {
        color: rgb(var(--black));
        flex-shrink: 0;
        height: 1rem;
        width: 1rem;
    }

.accordion-alert .alert-chevron-div {
    width: 1rem;
    height: 1rem;
}

.accordion-alert.collapsed {
    max-height: 5.5rem;
}

    .accordion-alert.collapsed .alert-chevron svg {
        transform: rotate(180deg);
    }

.accordion_flex {
    background-color: rgb(var(--white));
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    position: relative;
}

    .accordion_flex > div {
        flex-grow: 1;
    }

@media screen and (min-width: 1024px) {
    .accordion_flex {
        flex-direction: row;
    }
}

.accordion_flex .card-more-faq__anchor {
    height: fit-content;
    width: 100%;
}

@media screen and (min-width: 1024px) {
    .accordion_flex .card-more-faq__anchor {
        flex-shrink: 0;
        position: sticky;
        top: 0;
        width: 21rem;
    }
}

.accordion_fullwidth {
    background-color: rgb(var(--white));
    height: 100%;
    padding: 2.5rem 1.25rem 2.5rem 1.25rem;
}

@media screen and (min-width: 640px) {

    .accordion_fullwidth {
        padding: 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .accordion_fullwidth {
        padding: 3rem
    }
}

.accordion_fullwidth__section:not(:nth-child(1)):not(:nth-child(2)) {
    border-color: rgba(var(--black), 0.2);
    border-top-width: 0.0625rem;
    padding-top: 2rem;
}

@media screen and (min-width: 640px) {

    .accordion_fullwidth__section:not(:nth-child(1)):not(:nth-child(2)) {
        padding-top: 2rem
    }
}

.accordion_fullwidth__section:not(:first-child) {
    padding-bottom: 2rem;
}

@media screen and (min-width: 640px) {

    .accordion_fullwidth__section:not(:first-child) {
        padding-bottom: 2rem
    }
}

.accordion_fullwidth__title-banner {
    display: flex;
    gap: 1.25rem;
    justify-content: space-between;
    width: 100%;
}

    .accordion_fullwidth__title-banner svg {
        cursor: pointer;
        flex-shrink: 0;
        height: var(--size);
        justify-self: right;
        width: var(--size);
        margin-left: auto;
        --size: 1rem;
        stroke-width: 2;
    }

@media screen and (min-width: 640px) {

    .accordion_fullwidth__title-banner svg {
        margin-right: 2rem
    }
}

.accordion_form__fullwidth {
    width: 100%;
    height: 100%;
    margin-top: 1.25rem;
}

    .accordion_form__fullwidth .accordion_form__section {
        cursor: pointer;
        border-bottom: 1px solid rgba(var(--black), 0.2);
        --padding-bottom: 1.5rem;
        --padding-top: 1.5rem;
        padding-bottom: var(--padding-bottom);
        padding-top: var(--padding-top);
    }

        .accordion_form__fullwidth .accordion_form__section:first-child {
            border-top: 1px solid rgba(var(--black), 0.2);
        }

@media screen and (min-width: 640px) {
    .accordion_form__fullwidth .accordion_form__section {
        --padding-bottom: 1.75rem;
        --padding-top: 1.75rem;
    }
}

@media screen and (min-width: 768px) {
    .accordion_form__fullwidth .accordion_form__section {
        --padding-bottom: 2rem;
        --padding-top: 2rem;
    }
}

.accordion_form__fullwidth .accordion_form__title_banner {
    display: flex;
}

    .accordion_form__fullwidth .accordion_form__title_banner svg {
        flex-shrink: 0;
        cursor: pointer;
        stroke: currentcolor;
        stroke-width: 2;
        --size: 1rem;
        height: var(--size);
        width: var(--size);
        margin-left: auto;
        margin-right: 1.25rem;
    }

@media screen and (min-width: 640px) {

    .accordion_form__fullwidth .accordion_form__title_banner svg {
        margin-right: 2rem
    }
}

.accordion_form__fullwidth .accordion_form__header {
    cursor: pointer;
}

.accordion_form__fullwidth .accordion_form__border {
    border-top-width: 1px;
    border-color: rgb(var(--mid-grey-tint));
    padding-bottom: 1.25rem;
}

.accordion-border {
    border-color: rgba(var(--black), 0.2);
    border-top-width: 0.0625rem;
}

.accordion_flex .accordion-border {
    padding-bottom: 0rem;
    padding-top: 0;
}

.accordion__header {
    color: rgb(var(--black));
    --font-size: 2.25rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size, var(--font-h2-default)) * -0.02);
    line-height: 160%;
    margin-bottom: 1.75rem;
}

@media screen and (min-width: 640px) {

    .accordion__header {
        --font-size: 2.125rem
    }
}

@media screen and (min-width: 1024px) {

    .accordion__header {
        --font-size: 2.25rem
    }
}

.accordion__section-links__header {
    color: rgb(var(--black));
    cursor: pointer;
    font-family: var(--font-body-copy);
    --font-size: 1.125rem;
    font-size: var(--font-size);
    font-weight: 400;
    line-height: 160%;
    text-align: left;
}

    .accordion__section-links__header.font-bold {
        font-weight: bold;
    }

.accordion__section-link__p {
    color: rgb(var(--black));
    --font-size: 1rem;
    font-size: var(--font-size);
    padding-right: 1.5rem;
    padding-top: 1.25rem;
}

.business-finance {
    display: flex;
    flex-direction: column-reverse;
    overflow: hidden;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .business-finance {
        flex-direction: row
    }
}

.business-finance__container {
    color: rgb(var(--black));
    padding: 2.25rem 1.25rem 2.25rem 1.25rem;
    width: 100%;
}

@media screen and (min-width: 640px) {

    .business-finance__container {
        padding: 4.25rem 2.5rem 4.25rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .business-finance__container {
        padding: 5rem 2.5rem 5rem 3rem;
        width: 50%
    }
}

@media screen and (min-width: 1280px) {

    .business-finance__container {
        padding: 7.5rem 4.25rem 7.5rem 3rem
    }
}

.business-finance__header {
    margin-bottom: 0.75rem;
    width: 100%;
}

.business-finance__p {
    margin-bottom: 2.5rem;
}

.bf-image-container {
    width: 100%;
    display: flex;
}

@media screen and (min-width: 1024px) {

    .bf-image-container {
        width: 50%
    }
}

.bf-image-angle {
    object-fit: cover;
    height: 17.5rem;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .bf-image-angle {
        height: unset
    }
}

.mortgages-block {
    color: rgb(var(--black));
    display: flex;
    flex-direction: column;
    overflow: hidden;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .mortgages-block {
        flex-direction: row
    }
}

.mortgages-block__text-container {
    padding: 2.25rem 1.25rem 2.25rem 1.25rem;
    width: 100%;
}

@media screen and (min-width: 640px) {

    .mortgages-block__text-container {
        padding: 4.25rem 2.5rem 4.25rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .mortgages-block__text-container {
        padding: 5rem 3rem 5rem 2.5rem;
        width: 50%
    }
}

@media screen and (min-width: 1280px) {

    .mortgages-block__text-container {
        padding: 7.5rem 3rem 7.5rem 4.25rem
    }
}

.mortgages-block__header {
    margin-bottom: 0.75rem;
    width: 100%;
}

.mortgages-block__p {
    margin-bottom: 2.5rem;
}

.mortgages-block-image__container {
    width: 100%;
    display: flex;
}

@media screen and (min-width: 1024px) {

    .mortgages-block-image__container {
        width: 50%
    }
}

.mortgages-block-image-angle {
    object-fit: cover;
    height: 17.5rem;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .mortgages-block-image-angle {
        height: unset
    }
}

.card-group {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1.875rem;
}

.card {
    align-items: flex-start;
    cursor: pointer;
    display: flex;
    flex-shrink: 0;
    flex-wrap: wrap;
    height: 19.75rem;
    overflow: hidden;
    padding: 1.875rem;
    position: relative;
    width: 20.5rem;
}

.card__content {
    height: auto;
    overflow-wrap: break-word;
}

/* This breakpoint is required to cope with the margin-side added to the container causing the card to overflow the container on smaller mobile sizes. This correction is also seen on article-listing-blog */

@media screen and (min-width: 430px) {
    .card {
        width: 22.875rem;
    }
}

.card__content .category {
    font-weight: 700;
}

.card-animation:hover {
    box-shadow: 0rem 0rem 1rem 0.2rem rgba(var(--black), 0.15), 0px 0px 0px 0px inset;
}

.card-animation {
    display: inline-block;
    overflow: hidden;
    position: relative;
    transform: perspective(0.0625rem) translateZ(0);
    -webkit-transform: perspective(0.0625rem) translateZ(0);
    vertical-align: middle;
}

    .card-animation::before {
        background: rgb(var(--primary-colour));
        bottom: 0;
        content: "";
        height: 0.25rem;
        left: 0;
        position: absolute;
        right: 100%;
        transition-duration: 0.3s;
        transition-property: right;
        transition-timing-function: ease-out;
        -webkit-transition-duration: 0.3s;
        -webkit-transition-property: right;
        -webkit-transition-timing-function: ease-out;
        z-index: -1;
    }

    .card-animation:hover:before, .card-animation:focus:before, .card-animation:active:before {
        right: 0;
    }

.card-label {
    --font-size: var(--font-p-default);
    font-weight: bold;
}

    .card-label svg {
        height: 0.75rem;
        width: 0.75rem;
    }

.card-link-container_blog {
    bottom: 1.875rem;
    display: flex;
    justify-content: flex-end;
    padding: 0rem 1.875rem 1.875rem 1.875rem;
}

.card-link-container_img {
    bottom: 0rem;
    display: flex;
    justify-content: flex-end;
    padding: 1.5rem 1.875rem 1.875rem 1.875rem;
}

.card-title-link__section-narrow > a > .title-link-card__article > .card-link-container {
    bottom: 1.875rem;
    display: flex;
    justify-content: flex-end;
    padding-top: 1.5rem;
    position: fixed;
    width: 83.5%;
}

.card-link-container {
    bottom: 1.875rem;
    display: flex;
    justify-content: flex-end;
    padding-top: 1.5rem;
    position: fixed;
    width: 90%;
}

.card-link {
    align-items: center;
    background-color: rgb(var(--primary-colour));
    display: flex;
    height: 2.5rem;
    width: 2.5rem;
    padding: 0.75rem;
}

.card-grey {
    background-color: rgb(var(--grey-light));
}

.card__header {
    width: 100%;
}

.card__p {
    display: -webkit-box;
    margin-top: 1.25rem;
    margin-bottom: 1.75rem;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

.card.blog {
    width: 100%;
    margin: 0;
}

.card.listing-blog {
    width: 100%;
    height: 24.25rem;
    margin: 0;
}

.title-link-card__article {
    align-items: flex-start;
    display: flex;
    flex-shrink: 0;
    flex-wrap: wrap;
    height: 100%;
    overflow: hidden;
    padding: 1.875rem;
    position: relative;
    width: 100%;
}

.title-link-card__article_img {
    height: 100%;
}

.title-link-card__image-container {
    overflow: hidden;
}

.title-link-card__image {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 14rem;
    object-fit: cover;
    overflow: hidden;
    transform: scale(1,1);
    -webkit-transform: scale(1,1);
    transition: all 1s;
    transition-timing-function: ease-in-out;
}

.title-link-card__content__img {
    min-height: 12.5rem;
    padding: 1.875rem 1.875rem 0rem 1.875rem;
}

.title-link-card__cta {
    display: flex;
    margin-bottom: 0.75rem;
}

.title-link-card__title {
    display: flex;
    font-family: var(--font-body-copy);
    font-weight: bold;
    justify-content: flex-start;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.title-link-card__p {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-clamp: 3;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.title-link-card__a {
    z-index: 10;
}

.card-more-faq__title {
    padding-bottom: 1.25rem;
}

.card-more-faq {
    color: rgb(var(--white));
    cursor: pointer;
    display: flex;
    flex-direction: column;
    height: 13rem;
    overflow: hidden;
    padding: 1.25rem;
    width: 21rem;
}

.card-more-faq__anchor {
    display: inline-block;
}

.card-more-faq__link svg {
    height: 0.75rem;
    width: 0.75rem;
}

.card-more-faq__link-primary {
    color: rgb(var(--primary-colour));
}

.card-more-faq-grey-light {
    color: rgb(var(--black));
}

.card-more-faq-white {
    border: 0.0625rem solid;
    border-color: rgba(var(--black), 0.1);
    color: rgb(var(--black));
}

.card-title-link__section-wide {
    width: 36rem;
    height: 15.75rem;
}

.card-title-link__section-narrow {
    width: 24rem;
    height: 18rem;
}

.card-title-link__section-narrow-image {
    width: 24rem;
    height: 35.25rem;
}

.card-title-link__section-flex {
    display: flex;
    flex-wrap: wrap;
}

.checkbox-group .checkbox-container:first-child {
    margin-top: 1.25rem;
}

.checkbox-container {
    align-items: center;
    display: flex;
    padding: 0.188rem;
    padding-top: 0.375rem;
    width: 17.875rem;
}

input[type="checkbox"] {
    --background: var(--white);
    --border: var(--black);
    align-self: flex-start;
    appearance: none;
    background-color: rgb(var(--background, --white));
    border: 0.0625rem solid rgb(var(--border, --black));
    border-radius: 0.25rem;
    cursor: pointer;
    display: inline-block;
    flex-shrink: 0;
    height: 1rem;
    position: relative;
    margin-top: 0.1rem;
    width: 1rem;
}

    input[type="checkbox"].anchor__checkbox-styling {
        background-color: rgb(var(--grey-light));
        border-color: rgba(var(--black),0.1);
        margin-right: 0.75rem;
    }

    input[type="checkbox"]:before {
        content: '';
        display: block;
        left: 0;
        top: 0;
        position: absolute;
    }

    input[type="checkbox"]:checked + label {
        --font-family: var(--font-body-copy);
        font-weight: bold;
    }

    input[type="checkbox"]:hover {
        --border: var(--primary-colour);
    }

        input[type="checkbox"]:hover.anchor__checkbox-styling {
            background-color: rgb(var(--white));
            border-color: rgb(var(--primary-colour))
        }

    input[type="checkbox"]:checked {
        --background: var(--primary-colour);
        --border: var(--primary-colour);
    }

        input[type="checkbox"]:checked.anchor__checkbox-styling {
            background-color: rgb(var(--primary-colour));
            border-color: rgb(var(--primary-colour));
        }

        input[type="checkbox"]:checked:before {
            border: 0.0625rem solid rgb(var(--black));
            border-width: 0 0.0625rem 0.0625rem 0;
            height: 0.625rem;
            left: 0.3rem;
            transform: rotate(45deg);
            top: 0.05rem;
            width: 0.3125rem;
        }

    input[type="checkbox"]:disabled {
        background-color: rgba(var(--white), 40%);
        border-color: rgba(var(--black), 40%);
        cursor: not-allowed;
    }

        input[type="checkbox"]:disabled.anchor__checkbox-styling {
            background-color: rgba(var(--white), 40%);
            border-color: rgba(var(--black), 40%);
        }

        input[type="checkbox"]:disabled + label {
            color: rgba(var(--black), 40%);
        }

    input[type="checkbox"].checkbox-error {
        --border: var(--state-error);
    }

        input[type="checkbox"].checkbox-error:checked:before {
            --border: var(--state-error);
        }

.anchor__checkbox-container {
    column-gap: 0.75rem;
}

.anchor__checkbox-label {
    align-items: center;
    background-color: rgb(var(--white));
    border: 0.0625rem solid rgba(var(--black),0.1);
    box-shadow: 0rem 0.25rem 0.625rem -0.1875rem rgba(var(--black), 0.1);
    cursor: pointer;
    display: flex;
    padding: 0.75rem;
    width: fit-content;
}

    .anchor__checkbox-label:hover {
        background-color: rgb(var(--grey-light));
    }

    .anchor__checkbox-label:has(>input:checked) {
        border-color: rgb(var(--black));
    }

    .anchor__checkbox-label:has(>input:disabled) {
        background-color: rgba(var(--white), 40%);
        border-color: rgba(var(--black), 40%);
        cursor: not-allowed;
    }

.radio-custom {
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
}

    .radio-custom:before {
        content: '';
        background: #fff;
        border: 0.0625rem solid rgb(var(--black));
        display: inline-block;
        vertical-align: middle;
        width: 1.25rem;
        height: 1.25rem;
        padding: 0.125rem;
        text-align: center;
        border-radius: 50%;
    }

    .radio-custom:checked:before {
        background-color: rgb(var(--white));
        background-image: url('data:image/svg+xml; utf8, <svg width="25" height="25" viewBox="0 0 50 50" fill="%234FE200" stroke="%234FE200" xmlns="http://www.w3.org/2000/svg"><circle cx="25" cy="25" r="10" stroke="%234FE200" stroke-width="1" fill="%234FE200" /></svg>');
        background-repeat: no-repeat;
        background-position: center;
        border-color: rgb(var(--primary-colour));
    }

    .radio-custom.error:before {
        border-color: rgb(var(--state-error));
    }

    .radio-custom:hover:before {
        border-color: rgb(var(--primary-colour));
    }

    .radio-custom:disabled:before {
        background-color: rgba(var(--grey-light), 20%);
        border-color: rgba(var(--black), 40%);
        cursor: not-allowed;
    }

input[type="radio"]:disabled + label {
    color: rgba(var(--black), 40%);
}

input[type="radio"]:checked + label {
    font-weight: bold;
}

.document-table-container {
    border: 0.0625rem solid rgba(var(--black), 0.2);
    border-spacing: 0;
    display: block;
    margin-bottom: 4rem;
    margin-top: 4rem;
    overflow-x: auto;
    table-layout: auto;
    max-width: 100%;
}

@media screen and (min-width: 640px) {

    .document-table-container {
        margin-bottom: 5rem;
        margin-top: 5rem
    }
}

.document-table-row {
    background-color: rgb(var(--white));
    color: rgb(var(--black));
    --font-family: var(--font-body-copy);
    font-family: var(--font-family);
    --font-size: 1rem;
    font-size: var(--font-size);
    line-height: 160%;
    letter-spacing: calc(var(--font-size) * -0.02);
}

@media screen and (min-width: 768px) {

    .document-table-row {
        --font-size: 1rem
    }
}

.document-table-row td:first-child,
th:first-child {
    border-left: none;
}

.document-table-row td:first-child,
td:nth-child(2),
td:last-child,
td:nth-last-child(2),
th:last-child {
    border-right: none;
}

.document-table-container td:first-child,
th:first-child {
    border-left: none;
}

.document-table-container td:first-child,
td:last-child,
td:nth-last-child(2),
th:last-child {
    border-right: none;
}

.document-table-container tr:nth-child(odd) {
    background-color: rgb(var(--grey-light));
}

.document-table-cell {
    min-width: 8.5rem;
    padding: 1rem 2.5rem 1rem 0rem;
    text-align: left;
}

@media screen and (min-width: 1024px) {
    .document-table-cell {
        min-width: 12.5rem;
        padding: 1rem 5rem 1rem 0rem;
    }
}

@media screen and (min-width: 1280px) {
    .document-table-cell {
        min-width: 18rem;
    }
}

.document-name-column {
    width: 100%;
}

@media screen and (min-width: 1024px) {
    .document-name-column {
        width: 100%;
    }
}

@media screen and (min-width: 1280px) {
    .name-column {
        width: 100%;
        padding: 1rem 5rem 1rem 0rem;
    }
}

.document-table-cell-sidebar {
    min-width: 0.375rem;
    text-align: left;
}

.document-table-cell-sidebar-popular {
    background-color: rgb(var(--primary-colour));
}

.document-table-header {
    background-color: rgb(var(--white)) !important;
    color: rgb(var(--black));
    font-family: var(--font-body-copy);
    --font-size: 1rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    line-height: 120%;
}

@media screen and (min-width: 768px) {

    .document-table-header {
        --font-size: 1rem
    }
}

.document-table-header-cell {
    min-width: 8.75rem;
    padding: 1rem 1rem 1rem 0rem;
    text-align: left;
}

@media screen and (min-width: 1024px) {
    .document-table-header-cell {
        min-width: 15rem;
    }
}

@media screen and (min-width: 1280px) {
    .document-table-header-cell {
        min-width: 20rem;
    }
}

.document-name-header {
    min-width: 20rem;
    width: 100%;
}

@media screen and (min-width: 1280px) {
    .document-name-header {
        width: 100%;
    }
}

.document-table-header-cell.most-popular {
    padding-left: 1rem;
}

.document-table-header-cell:first-child button {
    padding-left: 5.50rem;
}

@media screen and (min-width: 1024px) {

    .document-table-header-cell:first-child button {
        padding-left: 6.25rem
    }
}

.document-table-header-cell button {
    color: rgb(var(--black));
    display: flex;
    justify-content: flex-start;
    width: 100%;
}

    .document-table-header-cell button p {
        font-weight: bold;
        padding-right: 0.5rem;
    }

.document-table-sort-marker {
    float: right;
}

    .document-table-sort-marker:focus-visible {
        outline: 2px solid rgb(var(--teal));
        outline-offset: -2px;
    }

.header-sort svg {
    height: 1rem;
    width: 1rem;
    transition: all 200ms ease-in-out;
}

.document-table-popular-header {
    background-color: rgb(var(--primary-colour));
    color: rgb(var(--black));
    font-family: var(--font-body-copy);
    --font-size: 1rem;
    font-size: var(--font-size);
    font-weight: bold;
    letter-spacing: calc(var(--font-size) * -0.02);
    line-height: 160%;
    padding: 1rem;
    text-align: left;
}

@media screen and (min-width: 768px) {

    .document-table-popular-header {
        --font-size: 1rem
    }
}

.document-table-popular-header td:last-child,
th:last-child {
    border-right: none;
}

.document-table-row:hover {
    cursor: pointer;
    font-weight: bold;
    letter-spacing: calc(var(--font-size) * -0.05);
}

.document-table-icon-column {
    border-right: none !important;
    padding: 0.69rem 1.5rem 0.69rem 1.06rem;
    width: 2rem;
}

    .document-table-icon-column svg {
        color: rgb(var(--black));
        height: 0.75rem;
        width: 0.75rem;
    }

@media screen and (min-width: 1024px) {

    .document-table-icon-column {
        padding: 0.69rem 2rem 0.69rem 1.06rem
    }
}

.document-table-icon-column div {
    align-items: center;
    background-color: rgb(var(--primary-colour));
    display: flex;
    justify-content: center;
    padding: 0.75rem 1rem;
}

.document-table-new-lozenge-column {
    padding: 1rem 1.75rem 1rem 0.5rem;
    width: 5rem;
}

@media screen and (min-width: 768px) {
    .document-table-new-lozenge-column {
        padding: 1rem 1.75rem 1rem 0.5rem;
    }
}

.document-table-new-lozenge {
    background-color: rgb(var(--black));
    border-radius: 2rem;
    color: rgb(var(--white));
    flex-shrink: 0;
    --font-size: 0.75rem;
    font-size: var(--font-size);
    font-weight: bold;
    height: 1.5rem;
    padding: 0.5rem;
    text-align: center;
}

.rotate-header-chevron svg {
    transform: rotate(180deg);
}

#button {
    margin-top: 100px;
}

#tooltip {
    background: #333;
    color: white;
    display: none;
    font-family: var(--font-body-copy);
}

    #tooltip[data-show] {
        display: block;
    }

#arrow,
#arrow::before {
    position: absolute;
    width: 0.5rem;
    height: 0.5rem;
    background: inherit;
}

#arrow {
    visibility: hidden;
}

    #arrow::before {
        visibility: visible;
        content: '';
        transform: rotate(45deg);
    }

/* color for help icon svg */

.question-mark-black-tooltip {
    color: rgb(var(--black));
}

.question-mark-white-tooltip {
    color: rgb(var(--white));
}

.question-mark-grey-tooltip {
    color: rgb(var(--grey-light));
}

.question-mark-primary-tooltip {
    color: rgb(var(--primary-colour));
}

/* color for tooltip box */

.tooltip-main {
    border-radius: 0;
    color: rgb(var(--black));
}

.black-tooltip {
    background-color: rgb(var(--black));
    color: rgb(var(--white));
}

.white-tooltip {
    background-color: rgb(var(--white));
}

.grey-tooltip {
    background-color: rgb(var(--grey-light));
}

.primary-tooltip {
    background-color: rgb(var(--primary-colour));
}

.tooltip-container {
    padding: 0.375rem !important;
    background-color: unset !important;
}

#tooltip[data-popper-placement^='top'] > .tooltip-main > #arrow {
    bottom: 0.125rem;
}

#tooltip[data-popper-placement^='bottom'] > .tooltip-main > #arrow {
    top: 0.125rem;
}

#tooltip[data-popper-placement^='left'] > .tooltip-main > #arrow {
    right: -0.25rem;
}

#tooltip[data-popper-placement^='right'] > .tooltip-main > #arrow {
    left: -0.25rem;
}

.tooltip__header {
    --font-size: 1rem;
    font-family: var(--font-body-copy);
    font-size: var(--font-size);
    letter-spacing: -0.015rem;
    margin: 0;
}

.tooltip-text-container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.tooltip-text {
    font-size: 0.75rem;
    letter-spacing: -0.015rem;
    text-align: left;
}

    .tooltip-text p a {
        color: unset !important;
        font-weight: bold;
        font-family: var(--font-body-copy);
        font-size: 1rem;
        letter-spacing: -0.015rem;
        margin: 0;
        text-decoration: underline !important;
    }

.tooltip-box {
    color: rgb(var(--white));
    padding-top: 1rem;
    padding-bottom: 1rem;
    ;
    padding-right: 0.75rem;
    padding-left: 0.75rem;
}

.tooltip-main {
    z-index: inherit;
}

.tooltip-help-icon {
    cursor: pointer;
    z-index: 10;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    padding-bottom: 0.75rem;
    padding-top: 0.75rem;
}

    .tooltip-help-icon svg {
        height: 1rem;
        width: 1rem;
    }

.int-banner-only {
    background-color: rgb(var(--black));
    color: rgb(var(--white));
    font-family: var(--font-body-copy);
    --font-size: 1rem;
    font-size: var(--font-size);
    --padding-x: 0rem;
    --padding-y: 1rem;
    padding: var(--padding-y) var(--padding-x);
    text-align: center;
}

    .int-banner-only p {
        display: inline;
    }

    .int-banner-only a {
        color: rgb(var(--primary-colour));
        display: inline;
        font-family: var(--font-body-copy);
        font-weight: bold;
    }

.int-banner {
    align-items: center;
    display: flex;
    height: 21rem;
    justify-content: center;
    overflow: hidden;
}

.intermediaries-banner__header {
    color: rgb(var(--white));
    padding-bottom: 0.75rem;
}

.int-banner-container {
    background-color: rgba(0,0,0,1); /* Black background with opacity */
    height: 100%;
}

.int-banner-text-container {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    position: absolute;
}

.int-banner-image {
    height: 100%;
    object-fit: cover;
    opacity: 0.4;
}

:root {
    --left-image-copy-mobile-angle: polygon(0 0, 100% 0, 100% 91%, 0 100%);
    --right-image-copy-mobile-angle: polygon(0 0, 100% 0, 100% 100%, 0 91%);
}

@media screen and (min-width: 1280px) {

    .left-image-height {
        min-height: 46.875rem
    }
}

.image-copy .circle {
    display: none;
}

@media screen and (min-width: 768px) {

    .image-copy .circle {
        display: block;
        width: 15rem;
        height: 15rem;
        border-radius: 50%;
        position: absolute;
        opacity: 10%;
        left: 60%;
        top: 34rem;
        margin-bottom: -2rem
    }
}

@media screen and (min-width: 1280px) {

    .image-copy .circle {
        left: 75%;
        top: 75%
    }
}

.image-copy-list {
    height: auto;
    display: flex !important; /*important used to override other display properties such as on the .yellow class as needs to flex to a 2 column list*/
    height: auto;
    flex-grow: 0;
    width: 100%;
    column-gap: 4.688rem;
    row-gap: 0.938rem;
    flex-flow: column;
}

@media screen and (min-width: 1280px) {

    .image-copy-list {
        flex-flow: column wrap;
        max-height: calc(100% - 30rem)
    }
}

.image-copy-list li {
    width: 100%;
}

@media screen and (min-width: 1280px) {

    .image-copy-list li {
        width: 23.625rem
    }
}

.left-circle {
    border-radius: 50%;
    margin-right: auto;
    margin-left: auto;
    margin-top: 1.75rem;
    position: relative;
    left: 0rem;
    top: 0rem;
    width: 100%;
    height: 13.938rem;
    width: 13.938rem;
}

@media screen and (min-width: 380px) {

    .left-circle {
        height: 20.938rem;
        width: 20.938rem
    }
}

@media screen and (min-width: 768px) {

    .left-circle {
        left: 0rem;
        top: -4rem;
        width: 44.5rem;
        height: 44.5rem
    }
}

@media screen and (min-width: 1280px) {

    .left-circle {
        position: absolute;
        width: 39rem;
        height: 39rem;
        left: 5%;
        top: 0rem
    }
}

.image-copy .angled {
    display: none;
}

@media screen and (min-width: 768px) {

    .image-copy .angled {
        display: block;
        position: absolute;
        height: 53.75rem;
        width: 86.875rem;
        transform-origin: center;
        transform: translateX(0%) translateY(0%) rotate(45deg);
        left: -27rem;
        top: -40rem;
        opacity: 10%
    }
}

@media screen and (min-width: 1280px) {

    .image-copy .angled {
        left: -25rem;
        top: 25.75rem
    }
}

.left-image {
    position: relative;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 13.125rem;
    clip-path: var(--right-image-copy-mobile-angle);
}

@media screen and (min-width: 380px) {

    .left-image {
        height: 18.125rem
    }
}

@media screen and (min-width: 768px) {

    .left-image {
        top: -5rem;
        left: -5rem;
        height: 45.625rem;
        clip-path: polygon(0 0, 95% 0, 88% 99%, 0 90%)
    }
}

@media screen and (min-width: 1280px) {

    .left-image {
        position: absolute;
        left: 0px;
        top: 0px;
        width: 50%;
        height: 43.75rem;
        clip-path: polygon(0 0, 95% 0, 88% 99%, 0 90%)
    }
}

.left-full {
    top: 0px;
    left: 0px;
    width: 100%;
    clip-path: var(--left-image-copy-mobile-angle);
}

@media screen and (min-width: 768px) {

    .left-full {
        position: relative;
        width: cal(120% + 10rem);
        top: -5rem
    }
}

@media screen and (min-width: 1280px) {

    .left-full {
        top: 0px;
        left: 0px;
        width: 50%;
        height: 100%;
        position: absolute;
        clip-path: polygon(0 0, 98% 0, 88% 100%, 0 100%)
    }
}

.right-image {
    position: relative;
    right: 0px;
    top: 0px;
    width: 100%;
    height: 13.125rem;
    clip-path: var(--left-image-copy-mobile-angle);
}

@media screen and (min-width: 380px) {

    .right-image {
        height: 18.125rem
    }
}

@media screen and (min-width: 768px) {

    .right-image {
        top: -5rem;
        right: -5rem;
        height: 45.938rem;
        clip-path: polygon(8% 0, 100% 0, 100% 85%, 18% 92%)
    }
}

@media screen and (min-width: 1280px) {

    .right-image {
        position: absolute;
        right: 0px;
        top: 0px;
        width: 50%;
        height: 43.75rem;
        clip-path: polygon(8% 0, 100% 0, 100% 85%, 18% 92%)
    }
}

.right-bullet-image,
.right-bottom-down {
    position: relative;
    right: 0px;
    top: 0px;
    width: 100%;
    height: 13.125rem;
    clip-path: var(--left-image-copy-mobile-angle);
}

@media screen and (min-width: 380px) {

    .right-bullet-image,
    .right-bottom-down {
        height: 18.125rem
    }
}

@media screen and (min-width: 768px) {

    .right-bullet-image,
    .right-bottom-down {
        top: -5rem;
        right: -5rem;
        height: 45.625rem;
        clip-path: polygon(0 0, 100% 0, 100% 92%, 8% 98%)
    }
}

@media screen and (min-width: 1280px) {

    .right-bullet-image,
    .right-bottom-down {
        position: absolute;
        right: 0px;
        top: 0px;
        width: 40%;
        height: 42.625rem;
        clip-path: polygon(0 0, 100% 0, 100% 92%, 10% 98%)
    }
}

.right-bottom-up {
    position: relative;
    right: 0px;
    top: 0px;
    width: 100%;
    height: 13.125rem;
    clip-path: var(--right-image-copy-mobile-angle);
}

@media screen and (min-width: 380px) {

    .right-bottom-up {
        height: 18.125rem
    }
}

@media screen and (min-width: 768px) {

    .right-bottom-up {
        top: -5rem;
        right: -10rem;
        width: 46.875rem;
        height: 45.625rem;
        clip-path: polygon(15% 0, 100% 0, 100% 100%, 5% 90%)
    }
}

@media screen and (min-width: 1280px) {

    .right-bottom-up {
        position: absolute;
        right: 0px;
        top: 0px;
        width: 30%;
        height: 42.625rem;
        clip-path: polygon(15% 0, 100% 0, 100% 100%, 5% 90%)
    }
}

.image-copy__container {
    container-type: inline-size;
    position: relative;
}

@media screen and (min-width: 1280px) {

    .image-copy {
        min-height: 43.75rem
    }
}

.image-copy__cta {
    height: auto;
}

@media (max-width: 375px) {

    .image-copy__cta button {
        width: 100%
    }
}

.image-copy__header {
    --font-size: 2rem;
    width: 100%;
    padding-bottom: 0.75rem;
}

@media (min-width: 640px) {
    .image-copy__header {
        --font-size: 2.125rem;
    }
}

@media screen and (min-width: 1280px) {
    .image-copy__header {
        --font-size: 2.25rem;
    }
}

.image-copy__p {
    --font-size: 1rem;
    padding-bottom: 2.5rem;
}

.image-copy-default__container {
    overflow: hidden;
    position: relative;
    width: 100%;
}

.image-copy-default__content {
    display: flex;
    flex-direction: column;
    width: 100%;
}

@media screen and (min-width: 1024px) {
    @media screen and (min-width: 1024px) {
        .image-copy-default__content__left {
            flex-direction: row
        }
    }

    @media screen and (min-width: 1024px) {

        .image-copy-default__content__right {
            flex-direction: row-reverse
        }
    }
}

.image-copy-default__image__container {
    display: flex;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .image-copy-default__image__container {
        width: 50%
    }
}

.image-copy-default__image {
    align-self: stretch;
    height: 17.5rem;
    object-fit: cover;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .image-copy-default__image {
        flex: 1 1 0;
        height: 100%;
        width: 50%
    }
}

.image-copy-default__text__left {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    justify-content: flex-start;
    padding: 2.25rem 1.25rem;
}

@media screen and (min-width: 640px) {

    .image-copy-default__text__left {
        padding: 4.25rem 2.5rem 4.25rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .image-copy-default__text__left {
        padding: 5rem 3rem 5rem 2.5rem;
        width: 50%
    }
}

@media screen and (min-width: 1280px) {

    .image-copy-default__text__left {
        padding: 7.5rem 3rem 7.5rem 4.25rem
    }
}

.image-copy-default__text__right {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    justify-content: flex-start;
    padding: 2.25rem 1.25rem;
}

@media screen and (min-width: 640px) {

    .image-copy-default__text__right {
        padding: 4.25rem 2.5rem 4.25rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .image-copy-default__text__right {
        padding: 5rem 2.5rem 5rem 3rem;
        width: 50%
    }
}

@media screen and (min-width: 1280px) {

    .image-copy-default__text__right {
        padding: 7.5rem 4.25rem 7.5rem 3rem
    }
}

.image-copy-narrow__container {
    height: 100%;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.image-copy-narrow__content {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .image-copy-narrow__content {
        justify-content: space-between;
        position: relative
    }

    @media screen and (min-width: 1024px) {

        .image-copy-narrow__content__left {
            flex-direction: row
        }
    }

    @media screen and (min-width: 1024px) {

        .image-copy-narrow__content__right {
            flex-direction: row-reverse
        }
    }
}

.image-copy-narrow__image__container {
    display: flex;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .image-copy-narrow__image__container {
        width: 35%
    }
}

.image-copy-narrow__image {
    align-self: stretch;
    height: 17.5rem;
    object-fit: cover;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .image-copy-narrow__image {
        flex: 1 1 0;
        height: 100%;
        width: 35%
    }
}

.image-copy-narrow__text__left {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    justify-content: flex-start;
    padding: 2.25rem 1.25rem;
}

@media screen and (min-width: 640px) {

    .image-copy-narrow__text__left {
        padding: 5rem 2.5rem 5rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .image-copy-narrow__text__left {
        padding: 5rem 3rem 5rem 2.5rem;
        width: 65%
    }
}

@media screen and (min-width: 1280px) {

    .image-copy-narrow__text__left {
        padding: 5rem 3rem 5rem 2.5rem
    }
}

@media screen and (min-width: 1440px) {

    .image-copy-narrow__text__left {
        padding: 5rem 3rem 5rem 4.25rem
    }
}

.image-copy-narrow__text__right {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    justify-content: flex-start;
    padding: 2.25rem 1.25rem;
}

@media screen and (min-width: 640px) {

    .image-copy-narrow__text__right {
        padding: 5rem 2.5rem 5rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .image-copy-narrow__text__right {
        padding: 5rem 2.5rem 5rem 3rem;
        width: 65%
    }
}

@media screen and (min-width: 1280px) {

    .image-copy-narrow__text__right {
        padding: 5rem 2.5rem 5rem 3rem
    }
}

@media screen and (min-width: 1440px) {

    .image-copy-narrow__text__right {
        padding: 5rem 4.25rem 5rem 3rem
    }
}

.image-copy-narrow {
    display: flex;
    flex-direction: column-reverse;
    justify-content: space-between;
    min-height: 100vw;
    overflow: hidden;
}

.image-copy-narrow-column {
    display: flex;
    flex-direction: column;
}

@media screen and (min-width: 1024px) {

    .image-copy-narrow-column {
        gap: 1rem;
        flex-direction: row
    }
}

.image-copy-narrow-column div {
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .image-copy-narrow-column div {
        width: 50%
    }
}

.image-copy-narrow-column ul {
    margin-left: 0;
    padding-left: 0;
}

@media screen and (min-width: 1024px) {

    .narrow-list__mobile {
        display: none
    }
}

.narrow-list ul {
    display: grid;
    margin-left: 0.625rem;
    padding-bottom: 2.5rem;
    padding-top: 2.5rem;
    row-gap: 0.25rem;
}

@media screen and (min-width: 1024px) {

    .narrow-list ul {
        padding-top: 2rem
    }
}

.narrow-list ul li {
    display: block;
    font-family: var(--font-book);
    --font-size: 1rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    padding-right: 1.25rem;
    position: relative;
}

.narrow-list li::before {
    content: url("data:image/svg+xml; utf8, <svg xmlns='http://www.w3.org/2000/svg' width='9' height='6' viewBox='0 0 9 6' fill='none'>  <path d='M9 3L7.15493e-08 -1.061e-06L0 6L9 3Z' fill='%234FE200'/> </svg>  ");
    height: 0.35rem;
    left: -1.125rem;
    margin-top: -0.7rem;
    position: absolute;
    top: 0.75rem;
}

.narrow-list ul li p {
    word-break: break-word;
}

.image-copy-narrow__list {
    display: none;
    padding-left: 0.5rem;
}

@media screen and (min-width: 380px) {

    .image-copy-narrow__list {
        column-gap: 2.5rem;
        display: grid;
        grid-template-columns: repeat(1, minmax(0, 1fr))
    }
}

@media screen and (min-width: 1024px) {

    .image-copy-narrow__list {
        display: none
    }
}

.narrow-list_large {
    display: none;
    padding-left: 0.5rem;
}

@media screen and (min-width: 1024px) {

    .narrow-list_large {
        display: grid;
        column-gap: 2.5rem;
        grid-template-columns: calc(50% - 1.25rem) calc(50% - 1.25rem)
    }
}

.narrow-list_large li {
    padding-right: 0 !important;
}

.narrow-list_large p {
    word-break: break-word;
}

.blog-loadmore-fade {
    -webkit-mask-image: linear-gradient(to bottom, #ffffff, #ffffff, #ffffff, transparent);
}

.calendar {
    position: relative;
    width: 100%;
    height: auto;
    margin-top: 1rem;
}

@media screen and (min-width: 640px) {

    .calendar {
        width: 24rem
    }
}

.calendar input {
    z-index: 10;
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: 5rem;
    border: 2px solid rgb(var(--mid-grey-tint));
    cursor: pointer;
    padding: 0 1.25rem;
}

@media screen and (min-width: 768px) {

    .calendar input {
        padding: 0 1.875rem
    }
}

.calendar input:hover {
    border-color: rgb(var(--aldermore-yellow));
}

.calendar input:focus {
    border-color: rgb(var(--transparent));
    outline: 2px solid rgb(var(--teal));
    outline-offset: -2px;
}

.calendar span {
    position: absolute;
    top: 0;
    z-index: 20;
    display: block;
    width: 0.5rem;
    height: 5rem;
    border-left-width: 0.5rem;
    cursor: pointer;
    border-color: rgb(var(--form-red));
}

.calendar:hover span {
    display: none;
}

.calendar input:not(:disabled):focus {
    outline: 2px solid rgb(var(--teal));
}

.calendar--error input {
    border-color: rgb(var(--form-red));
}

.calendar input:disabled:hover {
    cursor: not-allowed;
    border-color: rgb(var(--mid-grey-tint));
}

.textfield {
    position: relative;
    width: 100%;
    height: auto;
}

@media screen and (min-width: 640px) {

    .textfield {
        width: 24rem
    }
}

.textfield input {
    width: 100%;
    height: 5rem;
    border: 2px solid rgb(var(--mid-grey-tint));
    cursor: pointer;
    padding: 0 1.25rem;
}

@media screen and (min-width: 768px) {

    .textfield input {
        padding: 0 1.875rem
    }
}

.textfield input:hover {
    border-color: rgb(var(--aldermore-yellow));
}

.textfield input:focus {
    border-color: rgb(var(--transparent));
    outline: 2px solid rgb(var(--teal));
    outline-offset: -2px;
}

.textfield input:disabled {
    cursor: not-allowed;
}

.textfield input:not(:disabled):focus {
    outline: 2px solid rgb(var(--teal));
}

.textfield--error input {
    border-color: rgb(var(--form-red));
}

.textfield input:disabled:hover {
    cursor: not-allowed;
    border-color: rgb(var(--mid-grey-tint));
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    --font-size: var(--font-p-subtitle);
    appearance: none;
    background-color: transparent;
    font-family: var(--font-body-copy);
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    padding: 1rem 2.125rem 1rem 1rem;
    cursor: inherit;
    text-overflow: ellipsis;
}

.select {
    display: grid;
    cursor: pointer;
    align-items: center;
    background: #F5F4F7;
    max-width: 17.875rem;
    max-height: 2.875rem;
}

.select--error select {
    border-color: rgb(var(--form-red));
}

.select select,
.select::before {
    grid-area: select;
}

.select:before {
    content: '';
    justify-self: end;
    background-image: url('data:image/svg+xml; utf8, <svg viewBox="0 0 16 16" fill="black" stroke="%2365696B" stroke-width="1" xmlns="http://www.w3.org/2000/svg"><path d="M8 12L12 4H4L8 12Z" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/></svg> ');
    width: 0.875rem;
    height: 0.875rem;
    margin-right: 1rem;
    pointer-events: none;
    z-index: 3;
}

.select--disabled:before {
    content: '';
    justify-self: end;
    background-image: url('data:image/svg+xml; utf8, <svg viewBox="0 0 16 16" fill="black" stroke="%2365696B" stroke-width="1" xmlns="http://www.w3.org/2000/svg"><path d="M8 12L12 4H4L8 12Z" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/></svg> ');
    width: 0.875rem;
    height: 0.875rem;
    margin-right: 1rem;
}

.select--disabled {
    cursor: not-allowed;
    background-color: #eee;
    opacity: 0.40;
}

.savings-block {
    display: flex;
    flex-direction: column-reverse;
    overflow: hidden;
    position: relative;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .savings-block {
        flex-direction: row
    }
}

.savings-block__header {
    padding-bottom: 0.75rem;
}

.savings-block__p {
    padding-bottom: 2.5rem;
}

.savings-block__text-container {
    padding: 2.25rem 1.25rem 2.25rem 1.25rem;
    width: 100%;
}

@media screen and (min-width: 640px) {

    .savings-block__text-container {
        padding: 4.25rem 2.5rem 4.25rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .savings-block__text-container {
        padding: 5rem 2.5rem 5rem 3rem;
        width: 50%
    }
}

@media screen and (min-width: 1280px) {

    .savings-block__text-container {
        padding: 7.5rem 4.25rem 7.5rem 3rem
    }
}

.savings-block__flex-button-block {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

@media screen and (min-width: 1280px) {

    .savings-block__flex-button-block {
        width: 40%
    }
}

.savings-block__fscs {
    height: fit-content;
    margin-top: 2.5rem;
    width: fit-content;
    --size: 5rem;
}

    .savings-block__fscs a {
        height: fit-content;
        width: fit-content;
    }

    .savings-block__fscs svg {
        height: var(--size);
        width: var(--size);
    }

.savings-block__image-container {
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .savings-block__image-container {
        display: flex;
        height: unset;
        width: 50%
    }
}

.savings-block__image-container img {
    object-fit: cover;
    height: 17.5rem;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .savings-block__image-container img {
        height: 100%
    }
}

.masthead-homepage-container {
    background-color: rgb(var(--white));
    container-type: inline-size;
    position: relative;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .masthead-homepage-container {
        height: 35.5rem
    }
}

.masthead-homepage-content {
    background-color: rgb(var(--white));
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .masthead-homepage-content {
        flex-direction: row-reverse
    }
}

.masthead-homepage-content .masthead-homepage-content__image {
    height: 17.5rem;
    object-fit: cover;
    width: 100%;
}

@media (min-width: 1024px) {

    .masthead-homepage-content .masthead-homepage-content__image {
        height: 100%;
        width: 40%
    }
}

.masthead_homepage {
    color: rgb(var(--black));
    display: flex;
    flex-direction: column;
    height: 100%;
    position: relative;
    overflow: hidden;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .masthead_homepage {
        width: 60%
    }
}

.masthead_homepage__heading {
    /* Default for anything less than 380px */
    padding-bottom: 0.75rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    padding-top: 4rem;
}

@media screen and (min-width: 640px) {

    .masthead_homepage__heading {
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        padding-top: 5rem;
    }
}

@media screen and (min-width: 1024px) {

    .masthead_homepage__heading {
        padding-left: 3rem;
        padding-right: 5.75rem;
        padding-top: 7.5rem;
    }
}

@media screen and (min-width: 1280px) {

    .masthead_homepage__heading {
        padding-right: 6.25rem;
    }
}

@media screen and (min-width: 1440px) {

    .masthead_homepage__heading {
        padding-right: 12.25rem;
    }
}

.masthead_homepage__heading {
    z-index: 1;
}

.masthead_homepage__description {
    height: 100%;
    /* Default for anything less than 380px */
    padding-bottom: 4rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

@media screen and (min-width: 640px) {

    .masthead_homepage__description {
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        padding-bottom: 5rem;
    }
}

@media screen and (min-width: 768px) {

    .masthead_homepage__description {
        padding-left: 2.5rem;
        padding-right: 2.5rem;
    }
}

@media screen and (min-width: 1024px) {

    .masthead_homepage__description {
        padding-bottom: 7.5rem;
        padding-right: 5.875rem;
    }
}

@media screen and (min-width: 1280px) {

    .masthead_homepage__description {
        padding-left: 3rem;
        padding-right: 6.25rem;
    }
}

@media screen and (min-width: 1440px) {

    .masthead_homepage__description {
        padding-left: 3rem;
        padding-right: 12.25rem;
    }
}

.masthead_homepage__description {
    z-index: 1;
}

.masthead_homepage .logo {
    color: rgb(var(--primary-colour));
    position: absolute;
    z-index: 0;
    overflow: hidden;
}

.masthead-homepage-large {
    width: 100%;
    position: relative;
    height: 0;
    padding-bottom: 143%;
    background-color: #dedede;
}

@media screen and (min-width: 640px) {

    .masthead-homepage-large {
        padding-bottom: 113%
    }
}

@media screen and (min-width: 768px) {

    .masthead-homepage-large {
        padding-bottom: 121%
    }
}

@media screen and (min-width: 1024px) {

    .masthead-homepage-large {
        padding-bottom: 46%
    }
}

@media screen and (min-width: 1280px) {

    .masthead-homepage-large {
        padding-bottom: 46%
    }
}

@media screen and (min-width: 1440px) {
}

.masthead-homepage-large__alt-section {
    z-index: 0;
    position: absolute;
    width: 86%;
    height: 70%;
    background-color: rgb(var(--aldermore-yellow));
}

@media screen and (min-width: 640px) {

    .masthead-homepage-large__alt-section {
        width: 86%;
        height: 63%
    }
}

@media screen and (min-width: 768px) {

    .masthead-homepage-large__alt-section {
        width: 88%;
        height: 53%
    }
}

@media screen and (min-width: 1024px) {

    .masthead-homepage-large__alt-section {
        width: 52%;
        height: 91%
    }
}

@media screen and (min-width: 1280px) {

    .masthead-homepage-large__alt-section {
        width: 50%;
        height: 88%
    }
}

@media screen and (min-width: 1440px) {

    .masthead-homepage-large__alt-section {
        width: 51%;
        height: 88%
    }
}

.masthead-homepage-large__section {
    z-index: 0;
    position: absolute;
    width: 89%;
    height: 60%;
    background-color: rgb(var(--aldermore-yellow));
}

@media screen and (min-width: 640px) {

    .masthead-homepage-large__section {
        width: 90%;
        height: 60%
    }
}

@media screen and (min-width: 768px) {

    .masthead-homepage-large__section {
        width: 90%;
        height: 53%
    }
}

@media screen and (min-width: 1024px) {

    .masthead-homepage-large__section {
        width: 53%;
        height: 87%
    }
}

@media screen and (min-width: 1280px) {

    .masthead-homepage-large__section {
        width: 51%;
        height: 87%
    }
}

@media screen and (min-width: 1440px) {

    .masthead-homepage-large__section {
        width: 51%;
        height: 86%
    }
}

.masthead-homepage-large__block {
    position: absolute;
    z-index: 1;
    width: 76%;
    height: 100%;
    padding-top: 2.375rem;
}

@media screen and (min-width: 640px) {

    .masthead-homepage-large__block {
        width: 87%;
        padding-top: 5.5rem
    }
}

@media screen and (min-width: 1024px) {

    .masthead-homepage-large__block {
        width: 59%;
        padding-top: 5.5rem
    }
}

@media screen and (min-width: 1280px) {

    .masthead-homepage-large__block {
        width: 53%;
        padding-top: 3.75rem
    }
}

@media screen and (min-width: 1440px) {

    .masthead-homepage-large__block {
        width: 57%;
        padding-top: 7.625rem
    }
}

.masthead-homepage-large img {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    height: 100%;
    object-fit: cover;
}

.masthead-container {
    background-color: rgb(var(--pale-grey-tint));
}

    .masthead-container.white_bg {
        background-color: rgb(var(--white));
    }

.masthead-and-blackbox-container {
    position: relative;
}

@media screen and (min-width: 1024px) {

    .masthead-and-blackbox-container.masthead-small {
        height: 25.625rem
    }
}

@media screen and (min-width: 1280px) {

    .masthead-and-blackbox-container.masthead-small {
        min-height: unset;
        max-height: 20.625rem
    }
}

@media screen and (min-width: 1024px) {

    .masthead-and-blackbox-container.masthead-medium {
        height: 25.625rem
    }
}

@media screen and (min-width: 1280px) {

    .masthead-and-blackbox-container.masthead-medium {
        min-height: unset;
        max-height: 24rem
    }
}

@media screen and (min-width: 1024px) {

    .masthead-and-blackbox-container.masthead-title-image-container {
        height: 25rem
    }
}

@media screen and (min-width: 1280px) {

    .masthead-and-blackbox-container.masthead-title-image-container {
        min-height: unset;
        max-height: 20rem
    }
}

.masthead-black-box {
    background-color: rgb(var(--black));
    border-bottom: 0.25rem solid rgb(var(--primary-colour));
    color: rgb(var(--white));
    display: flex;
    flex-direction: column;
    padding: 1.88rem;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .masthead-black-box {
        width: 19.75rem
    }
}

.masthead-black-box__li {
    display: flex;
    align-items: center;
    padding-top: 1rem;
}

    .masthead-black-box__li:first-child {
        padding-top: 0;
    }

    .masthead-black-box__li svg {
        flex-shrink: 0;
        height: 1rem;
        width: 1rem;
        display: inline;
    }

.masthead-content {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .masthead-content {
        flex-direction: row-reverse
    }
}

.masthead-image {
    height: 17.5rem;
    object-fit: cover;
    width: 100%;
}

@media (min-width: 1024px) {

    .masthead-image {
        height: 100%;
        width: 40%
    }
}

.masthead-container {
    position: relative;
    width: 100%;
    height: 100%;
    background-color: rgb(var(--aldermore-yellow));
}

@media screen and (min-width: 1280px) {

    .masthead-container {
        max-height: 24rem
    }
}

.masthead-blackbox {
    position: inherit;
}

@media screen and (min-width: 1024px) {

    .masthead-blackbox {
        position: absolute;
        right: 3rem;
        bottom: 0
    }
}

.masthead-text-container {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    overflow: hidden;
    position: relative;
    color: #1E2019;
}

@media screen and (min-width: 375px) {

    .masthead-text-container {
        max-width: 100%
    }
}

@media screen and (min-width: 1024px) {

    .masthead-text-container {
        max-width: 60%
    }
}

.masthead-text-container .logo {
    color: rgb(var(--primary-colour));
    position: absolute;
    z-index: 1;
    overflow: hidden;
    /* for webkit based  browser */
    height: -webkit-fill-available;
    /* for mozilla browser */
    height: -moz-available;
}

@media screen and (min-width: 1440px) {

    .masthead-text-container .logo {
        max-width: 25.625rem
    }
}

.masthead-title-header {
    --font-size: 1.875rem;
}

@media screen and (min-width: 640px) {

    .masthead-title-header {
        --font-size: 2.5rem
    }
}

@media screen and (min-width: 768px) {

    .masthead-title-header {
        --font-size: 3rem
    }
}

@media screen and (min-width: 1024px) {

    .masthead-title-header {
        --font-size: 2.25rem
    }
}

@media screen and (min-width: 1280px) {

    .masthead-title-header {
        --font-size: 3rem
    }
}

.masthead-small-logo__container {
    position: absolute;
    right: 2rem;
    top: 2rem;
}

.masthead-logo__container {
    position: absolute;
    right: 1rem;
    top: 2rem;
    z-index: 10;
}

@media screen and (min-width: 640px) {

    .masthead-logo__container {
        top: 5rem
    }
}

.masthead-logo__container svg {
    height: 5rem;
    width: 5rem;
}

.masthead__header {
    margin-bottom: 0.75rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    padding-top: 1.25rem;
    z-index: 10;
}

@media screen and (min-width: 640px) {

    .masthead__header {
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        padding-top: 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .masthead__header {
        padding-left: 3rem;
        padding-right: 5.75rem;
        padding-top: 3rem
    }
}

@media screen and (min-width: 1280px) {

    .masthead__header {
        padding-left: 3rem;
        padding-right: 6.25rem
    }
}

@media screen and (min-width: 1440px) {

    .masthead__header {
        padding-left: 3rem;
        padding-right: 12.25rem
    }
}

.masthead__header_logo {
    width: calc(100% - 5rem)
}

/* mast head title only */

.masthead-type-only-container {
    align-items: flex-start;
    border-bottom: 0.25rem solid rgb(var(--primary-colour));
    color: rgb(var(--black));
    display: flex;
    flex-direction: column;
    gap: 2rem;
    padding: 2.5rem 1.25rem;
}

@media screen and (min-width: 376px) {

    .masthead-type-only-container {
        padding-left: 2.5rem;
        padding-right: 2.5rem
    }
}

@media screen and (min-width: 768px) {

    .masthead-type-only-container {
        padding-left: 3rem;
        padding-right: 3rem
    }
}

.masthead-type-only-container .backlink {
    margin-bottom: 1.5rem;
    margin-top: 0;
}

.masthead-type-only-container-onlyTitle {
    padding: 4rem 2rem;
}

@media screen and (min-width: 376px) {

    .masthead-type-only-container-onlyTitle {
        padding: 5rem 2.5rem
    }
}

@media screen and (min-width: 768px) {

    .masthead-type-only-container-onlyTitle {
        padding: 5rem 3rem
    }
}

.masthead-type-only__subheader {
    margin-top: 0.75rem;
}

.masthead-type-only__metrics-container {
    align-items: center;
    display: flex;
    margin-right: 1rem;
}

@media (min-width: 768px) {

    .masthead-type-only__metrics-container {
        margin-right: 0px
    }
}

.masthead-type-only__metrics-labels {
    background: rgb(var(--grey-light));
    border: 0.0625rem solid rgba(var(--black), 0.1);
    padding: 1rem 0.75rem;
}

.masthead-type-only__metrics-first-word {
    font-weight: bold;
}

.masthead-type-only__metrics-bullet {
    margin: 0rem 0.3rem;
}

/* ends here */

.masthead-image-title__header {
    padding-bottom: 4rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    padding-top: 1.25rem;
    z-index: 10;
}

@media screen and (min-width: 640px) {

    .masthead-image-title__header {
        padding-bottom: 5rem;
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        padding-top: 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .masthead-image-title__header {
        padding-left: 3rem;
        padding-right: 5.75rem;
        padding-top: 3rem
    }
}

@media screen and (min-width: 1280px) {

    .masthead-image-title__header {
        padding-left: 3rem;
        padding-right: 6.25rem
    }
}

@media screen and (min-width: 1440px) {

    .masthead-image-title__header {
        padding-left: 3rem;
        padding-right: 12.25rem
    }
}

.masthead__p {
    flex-grow: 1;
    padding-bottom: 4rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    z-index: 1;
}

@media screen and (min-width: 640px) {

    .masthead__p {
        padding-bottom: 5rem;
        padding-left: 2.5rem;
        padding-right: 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .masthead__p {
        padding-left: 3rem;
        padding-right: 5.75rem
    }
}

@media screen and (min-width: 1280px) {

    .masthead__p {
        padding-left: 3rem;
        padding-right: 6.25rem
    }
}

@media screen and (min-width: 1440px) {

    .masthead__p {
        padding-left: 3rem;
        padding-right: 12.25rem
    }
}

@media (min-width: 768px) {
    .masthead-title-and-image__sub-header {
        --font-size: 3rem;
        font-size: var(--font-size);
        letter-spacing: calc(var(--font-size) * -0.02);
    }
}

@media screen and (min-width: 1280px) {

    .masthead-small__p {
        --font-size: 1.125rem
    }
}

/* masthead - black box */

.masthead-black-box__header {
    padding-bottom: 0.75rem;
}

.masthead-black-box__cta {
    display: flex;
    justify-content: center;
}

@media screen and (min-width: 640px) {

    .masthead-black-box__cta {
        justify-content: flex-start
    }
}

@media screen and (min-width: 1024px) {

    .masthead-black-box__cta {
        justify-content: center
    }
}

.masthead-black-box__cta a, .masthead-black-box__cta button {
    width: 100%;
    min-width: 100%;
}

@media screen and (min-width: 640px) {

    .masthead-black-box__cta a, .masthead-black-box__cta button {
        width: 30%;
        min-width: 30%
    }
}

@media screen and (min-width: 1024px) {

    .masthead-black-box__cta a, .masthead-black-box__cta button {
        width: 100%;
        min-width: 100%
    }
}

.masthead-black-box-cta-margin {
    margin-bottom: 0.75rem;
}

.masthead-black-box__link-title {
    --font-size: 1rem;
    margin-left: 0.25rem;
}

.masthead-black-box__link-a {
    --font-family: var(--font-body-copy);
}

.masthead-black-box__hr {
    margin: 1rem 0;
    border-top-width: 1px;
    border-color: rgba(var(--white), 0.5);
}

.masthead-black-box__secondary-title {
    padding-bottom: 0.25rem;
}

.masthead-black-box__p {
    --font-size: 0.875rem;
}

.masthead-group-container {
    align-items: center;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    min-height: 17rem;
    position: relative;
    width: 100%;
}

.masthead-group-background-pattern {
    height: 100%;
    left: 0;
    object-fit: none;
    position: absolute;
    top: 0;
    width: 100%;
}

.masthead-group-content {
    background: linear-gradient(180deg, rgba(var(--group-colour), 1), rgba(var(--group-colour), 0));
    padding: 3rem 1.25rem;
    position: relative;
    text-align: center;
    width: 100%;
}

@media screen and (min-width: 640px) {

    .masthead-group-content {
        padding: 4rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .masthead-group-content {
        padding: 4rem 8.75rem
    }
}

@media screen and (min-width: 1280px) {

    .masthead-group-content {
        padding: 4rem 16.75rem
    }
}

@media screen and (min-width: 1440px) {

    .masthead-group-content {
        padding: 4rem 21.75rem
    }
}

.masthead-group-content-noCopy {
    padding: 8.75rem 1.25rem;
}

@media screen and (min-width: 640px) {

    .masthead-group-content-noCopy {
        padding: 7rem 2.5rem
    }
}

@media screen and (min-width: 768px) {

    .masthead-group-content-noCopy {
        padding: 7rem 4.5rem
    }
}

@media screen and (min-width: 1024px) {

    .masthead-group-content-noCopy {
        padding: 7rem 12.5rem
    }
}

@media screen and (min-width: 1280px) {

    .masthead-group-content-noCopy {
        padding: 7rem 20.5rem
    }
}

@media screen and (min-width: 1440px) {

    .masthead-group-content-noCopy {
        padding: 7rem 25.5rem
    }
}

.masthead_group__heading {
    --font-size: 2.625rem;
    font-family: var(--font-body-copy);
}

@media screen and (min-width: 640px) {

    .masthead_group__heading {
        --font-size: 2.875rem
    }
}

@media screen and (min-width: 1024px) {

    .masthead_group__heading {
        --font-size: 3rem
    }
}

.masthead_group__description {
    margin-top: 0.75rem;
}

.masthead-group-content__image {
    height: 17.5rem;
    margin-bottom: 3rem;
    object-fit: cover;
    position: relative;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .masthead-group-content__image {
        margin-bottom: 4rem;
        width: 43.5rem
    }
}

.faq-common-request__header {
    margin-bottom: 0.75rem;
}

@media screen and (min-width: 768px) {

    .faq-common-request__header {
        margin-bottom: 1.25rem
    }
}

.faq-item {
    border-color: rgba(var(--black), 0.2);
    border-top-width: 1px;
    padding: 1.25rem 0;
    text-align: left;
}

    .faq-item:focus-visible {
        outline-offset: -2px;
    }

@media screen and (min-width: 768px) {

    .faq-item {
        padding: 2rem 0
    }
}

.common-requests {
    padding: 2.25rem 1.25rem;
    text-align: left;
}

.common-requests__grid {
    display: grid;
    --columns: 1;
    grid-template-columns: repeat(var(--columns), minmax(0, 1fr));
}

@media screen and (min-width: 640px) {

    .common-requests__grid {
        --columns: 2
    }
}

@media screen and (min-width: 768px) {

    .common-requests__grid {
        --columns: 3
    }
}

@media screen and (min-width: 1024px) {

    .common-requests__grid {
        --columns: 4
    }
}

.requests-cta {
    padding: 0.625rem 0;
}

    .requests-cta:focus {
        outline: none;
    }

@media screen and (min-width: 768px) {

    .requests-cta {
        padding-bottom: 1rem
    }
}

.process-block {
    background-color: rgb(var(--white));
    --padding: 3rem;
    padding-bottom: var(--padding);
    padding-top: var(--padding);
}

@media screen and (min-width: 640px) {

    .process-block {
        --padding: 5rem
    }
}

@media screen and (min-width: 1024px) {

    .process-block_header {
        margin-left: 7.5rem;
        margin-right: 7.5rem;
        width: 58rem
    }
}

.process-block__container {
    --margin-top: 1.75rem;
    margin-top: var(--margin-top);
}

@media screen and (min-width: 1024px) {

    .process-block__container {
        --margin-top: 2rem;
        margin-left: 7.5rem;
        margin-right: 7.5rem;
        display: flex
    }
}

.process-block__step-item__container {
    display: flex;
    flex-direction: column;
    list-style-type: none;
}

@media screen and (min-width: 1024px) {

    .process-block__step-item__container {
        flex-shrink: 0;
        width: 14rem
    }
}

.process-block__step-item__container-icon {
    display: block;
    border-color: rgb(var(--black));
    border-radius: 50%;
    border-width: 1px;
    flex-shrink: 0;
    height: 2rem;
    margin-bottom: 0.5rem;
    width: 2rem;
}

@media screen and (min-width: 1024px) {

    .process-block__step-item__container-icon {
        margin-bottom: 0
    }
}

.process-block__step-item__container-button {
    align-items: stretch;
    display: flex;
    flex-direction: column;
    text-align: left;
    text-decoration: dotted;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .process-block__step-item__container-button {
        align-items: center;
        flex-direction: row;
        gap: 1rem;
        padding: 1.25rem 1rem
    }
}

.process-block__step-item__container-button .process-block__step_icon_and_chevron {
    display: flex;
    justify-content: space-between;
    flex-shrink: 0;
}

.process-block__step-item__layout {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

    .process-block__step-item__layout h4 {
        display: block;
    }

@media screen and (min-width: 1024px) {

    .process-block__step-item__layout h4 {
        display: none
    }
}

.process-block__step-item__layout p {
    display: none;
}

@media screen and (min-width: 1024px) {

    .process-block__step-item__layout p {
        display: block
    }
}

.process-block__step-text__container {
    display: none;
    position: relative;
}

@media screen and (min-width: 1024px) {

    .process-block__step-text__container {
        display: flex
    }
}

.process-block__step-content {
    color: rgb(var(--black));
    cursor: default;
    display: none;
    width: 100%;
}

    .process-block__step-content h3 {
        --font-family: var(--font-body-copy);
        --font-size: var(--font-p-default);
        font-weight: normal;
        --line-height: 160%;
    }

    .process-block__step-content.selected {
        display: none;
    }

@media screen and (min-width: 1024px) {

    .process-block__step-content.selected {
        display: block;
        padding-left: 3rem
    }
}

.process-block-step-index__title {
    --font-family: var(--font-body-copy);
    --font-size: var(--font-p-default);
    font-weight: normal;
    --line-height: 160%;
    margin-bottom: 0.5rem;
}

@media screen and (min-width: 1024px) {

    .process-block-step-index__title {
        display: none
    }
}

.process-block-step__label {
    font-family: var(--font-bold);
    margin-bottom: 1rem;
}

.process-block-step__p {
    margin-bottom: 1.75rem;
    margin-top: 0.5rem;
}

@media screen and (min-width: 1280px) {

    .process-block-step__p {
        width: 32.875rem
    }
}

.process-block-step__button-cta {
    --font-size: 0.875rem;
    align-items: center;
    border-color: rgb(var(--white));
    border-width: 1px;
    color: rgb(var(--white));
    display: inline-flex;
    padding: 1rem;
    text-decoration: none;
}

.process-block-step__title {
    padding-right: 0.75rem;
}

@media (min-width: 1024px) {
    .process-block-step__title {
        padding-right: 0rem;
    }
}

.process-step {
    cursor: pointer;
    z-index: 10;
}

@media screen and (min-width: 1024px) {

    .process-step {
        border-left: 1px solid transparent;
        height: fit-content
    }
}

@media screen and (min-width: 1024px) {

    .process-step.selected {
        background-color: rgb(var(--grey-light));
        border-left: 2px solid rgb(var(--primary-colour))
    }
}

.process-step.selected h5 {
    font-weight: bold;
}

.process-step.selected h3 {
    font-weight: bold;
}

.process-step.selected p {
    font-weight: bold;
}

.process-step.selected hr {
    display: none;
}

.process-step-mobile-content {
    color: rgb(var(--black));
    display: none;
    width: 100%;
}

    .process-step-mobile-content button {
        width: 100%;
    }

@media screen and (min-width: 640px) {

    .process-step-mobile-content button {
        width: unset
    }
}

.process-step-mobile-content.selected {
    display: block;
}

@media screen and (min-width: 1024px) {

    .process-step-mobile-content.selected {
        display: none
    }
}

.process-step-plus-minus__container {
    display: inline-block;
}

@media screen and (min-width: 1024px) {

    .process-step-plus-minus__container {
        display: none
    }
}

.process-step-plus-minus__container > svg {
    height: 1rem;
    stroke: currentColor;
    stroke-width: 2;
    width: 1rem;
}

.process-minus.show {
    display: block;
}

.process-minus.hide {
    display: none;
}

.process-plus.show {
    display: block;
}

.process-plus.hide {
    display: none;
}

.process_divider__hr {
    border-top: 1px solid rgb(var(--black), 20%);
    display: block;
    margin-bottom: 2rem;
    margin-top: 2rem;
}

@media screen and (min-width: 1024px) {

    .process_divider__hr {
        display: none
    }
}

@media screen and (min-width: 1024px) {

    .process-block-vertical-divider {
        width: auto;
        height: auto;
        border-color: rgb(var(--black), 20%);
        border-right-width: 1px
    }
}

/* Chrome, Safari, Edge, Opera */

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */

input[type='number'] {
    -moz-appearance: textfield;
}

.suitable-for {
    display: inline-block;
    height: 34rem;
    position: relative;
}

.suitable-for__container {
    display: flex;
    flex-direction: column;
}

    .suitable-for__container li {
        margin-bottom: 0.25rem;
    }

.event-listing {
    height: 29.7rem;
    margin: 0;
    padding: 0;
    position: relative;
}

.event-listing-container {
    display: flex;
    flex-direction: column;
    padding: 1.875rem;
}

.product-card-event-list__item {
    align-items: center;
    display: flex;
    padding-bottom: 0.75rem;
}

    .product-card-event-list__item svg {
        flex-shrink: 0;
        height: 1.5rem;
        margin-right: 1rem;
        width: 1.5rem;
    }

    .product-card-event-list__item:last-of-type {
        padding-bottom: 1rem;
    }

.product-card-event-list__item-text {
    display: flex;
    flex-direction: column;
}

a:hover .lead-blog-image img {
    transform: scale(1.1);
}

.lead-blog {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

@media screen and (min-width: 1280px) {

    .lead-blog {
        flex-direction: row;
        margin-left: auto !important;
        margin-right: auto !important;
        width: 64rem
    }
}

@media screen and (min-width: 1440px) {

    .lead-blog {
        width: 72.75rem
    }
}

.lead-blog-image {
    flex: 50%;
}

    .lead-blog-image figure {
        height: 22.125rem;
        overflow: hidden;
        width: 100%;
    }

@media screen and (min-width: 1280px) {

    .lead-blog-image figure {
        height: 100%
    }
}

.lead-blog-image figure img {
    height: 100%;
    object-fit: cover;
    transition: all 0.3s ease-in-out;
    transform: scale(1);
    width: 100%;
}

.lead-blog-container {
    display: flex;
    flex-direction: column;
    flex: 1 1 0%;
    flex: 100%;
    padding: var(--padding-top) var(--padding-side);
    --padding-top: 4rem;
    --padding-side: 2rem;
}

@media screen and (min-width: 640px) {

    .lead-blog-container {
        --padding-side: 3.5rem
    }
}

@media screen and (min-width: 768px) {

    .lead-blog-container {
        --padding-side: 5rem
    }
}

@media screen and (min-width: 1280px) {

    .lead-blog-container {
        --padding-side: 3.75rem;
        flex: 50%;
        height: 29.75rem
    }
}

@media screen and (min-width: 1440px) {

    .lead-blog-container {
        --padding-side: 5.625rem
    }
}

.lead-blog-container h2 {
    display: -webkit-box;
    margin-bottom: 1.75rem;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    white-space: normal;
}

.lead-blog-container p {
    display: -webkit-box;
    margin-bottom: 3rem;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    white-space: normal;
}

@media screen and (min-width: 640px) {

    .lead-blog-container p {
        -webkit-line-clamp: 3
    }
}

.lead-blog-container .category {
    font-weight: 700;
}

.lead-blog-container :last-child {
    margin-top: auto;
}

.blog-category {
    height: 1.25rem;
    max-width: 5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media screen and (min-width: 380px) {

    .blog-category {
        max-width: 50%
    }
}

.blog-read-time {
    flex-shrink: 0;
}

.blog-date {
    flex-shrink: 0;
}

.blog__p {
    display: -webkit-box;
    margin-bottom: 2rem;
    margin-top: 0.75rem;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    white-space: normal;
}

.blog_details {
    padding-bottom: 1.25rem;
}

.lead-blog__a {
    /* important needed here as the z-index it overrides is imported later, so this will never be used otherwise */
    z-index: 1 !important;
}

.listing-blog__container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 2rem;
}

.article-listing-blog {
    height: 100%;
    position: relative;
    text-align: left;
    width: 100%;
}

/* This breakpoint is required for cope with the fact that the iPhone
  14 is 390px and with the margin-side added to the container at a value
  of 375px there would not be enough room and the card will overflow the container */

@media screen and (min-width: 430px) {

    .article-listing-blog {
        width: 23.4375rem
    }
}

.article-listing-image {
    display: flex;
    width: 100%;
    height: 11.875rem;
}

    .article-listing-image img {
        object-fit: cover;
        width: 100%;
    }

.listing-blog-category {
    height: 1.25rem;
    max-width: 5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.listing-blog-banner__container {
    z-index: 0;
}

.listing-blog-copy__container {
    height: auto;
    width: 100%;
    z-index: 20;
}

.listing-blog__content {
    padding: 1.875rem 1.875rem 0rem 1.875rem;
    height: 17.75rem;
}

.listing-blog__title {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.bdm-card {
    display: flex;
    flex-direction: column;
}

@media screen and (min-width: 640px) {

    .bdm-card {
        flex-direction: row;
        width: 35.125rem
    }
}

@media screen and (min-width: 1024px) {

    .bdm-card {
        width: 46.875rem
    }
}

.bdm-card__image {
    width: 100%;
    flex-grow: 0;
}

@media screen and (min-width: 640px) {

    .bdm-card__image {
        width: 12.5rem
    }
}

.bdm-card__image img {
    object-fit: cover;
    width: 100%;
    height: 14.25rem;
}

@media screen and (min-width: 640px) {

    .bdm-card__image img {
        height: 100%
    }
}

.bdm-card__content {
    flex-grow: 1;
    height: auto;
}

.bdm-card__content__section {
    display: flex;
    flex-direction: column;
    margin: 1.5rem 1.75rem;
}

    .bdm-card__content__section hr {
        border-top: 1px solid currentcolor;
        opacity: 20%;
        margin-bottom: 1.25rem;
        margin-top: 1.25rem;
        width: 3.125rem;
    }

.bdm-card__header_title {
    margin-bottom: 1.25rem;
}

.bdm-card__header_name {
    margin-bottom: 0.25rem;
}

.bdm-card__telephone {
    margin-bottom: 0.25rem;
}

.bdm-card__a-email {
    text-decoration: underline;
}

.nav-footer-container__full {
    /* flex flex-col w-full text-white */
    color: rgb(var(--black));
    display: flex;
    flex-direction: column;
    width: 100%;
}

.nav-footer-top__container__full {
    display: flex;
    flex-direction: column;
    width: 100%;
    justify-content: center;
}

@media (min-width: 1280px) {
    .nav-footer-top__container__full {
        flex-direction: row;
    }
}

.nav-footer-top-left__container {
    /* md:p-desktop p-mobile lg:px-20 md:px-14 */
    background-color: rgb(var(--white));
    flex-direction: column;
    padding-bottom: 2.5rem;
    padding-top: 2.5rem;
    text-align: center;
    width: 100%;
}

.nav-footer__contact-us-container__full {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.nav-footer__contact-us-container__cta button {
    width: 19.625rem;
}

@media (min-width: 376px) {
    .nav-footer__contact-us-container__cta button {
        width: 11.5rem;
    }
}

.nav-footer__social-container__full {
    display: flex;
    margin-top: 0.625rem;
    width: 100%;
}

@media (min-width: 768px) {
    .nav-footer__social-container__full {
        margin-top: 1.25rem;
    }
}

.nav-footer-top-right__container {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-top: 3rem;
    padding-bottom: 3rem;
    width: 100%;
}

@media (min-width: 640px) {
    .nav-footer-top-right__container {
        padding-top: 3.875rem;
        padding-bottom: 3.875rem;
    }
}

.nav-footer-bottom__container__full {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    padding-bottom: 3.5rem;
    padding-top: 1.75rem;
}

    .nav-footer-bottom__container__full a {
        padding-top: 1.5rem;
    }

    .nav-footer-bottom__container__full h3 {
        padding-bottom: 0.25rem;
    }

/* one column */

.nav-footer-bottom__container__menu-one-column {
    flex-direction: column;
    padding-top: 3rem;
    width: 100%;
}

@media (min-width: 768px) {
    .nav-footer-bottom__container__menu-one-column {
        display: none;
    }
}

/* two columns */

.nav-footer-bottom__container__menu-two-column {
    display: none;
}

@media (min-width: 768px) {
    .nav-footer-bottom__container__menu-two-column {
        display: inline-flex;
        flex-direction: column;
        justify-content: flex-start;
        width: 49%;
    }

    #column1 {
        order: 1;
    }

    #column2 {
        order: 3;
    }

    #column3 {
        order: 2;
    }
}

@media (min-width: 1024px) {
    .nav-footer-bottom__container__menu-two-column {
        display: none;
    }
}

/* three columns */

.nav-footer-bottom__container__menu-three-column {
    display: none;
}

@media (min-width: 1024px) {
    .nav-footer-bottom__container__menu-three-column {
        display: inline-flex;
        flex-direction: column;
        justify-content: flex-start;
        width: 33%;
    }
}

.nav-footer-disclaimer__container {
    background-color: rgb(var(--white));
    padding-top: 1.75rem;
    padding-bottom: 1.75rem;
    width: 100%;
}

.nav-footer__header {
    --font-size: 1.25rem;
}

.nav-footer__menu-title__span {
    border-color: rgb(var(--black));
    font-family: var(--font-body-copy);
    font-weight: bold;
    --font-size: 1.125rem;
    /* padding-top: 3.5rem; */
}

.nav-footer__menu-item__link-container {
    height: auto;
    width: 100%;
}

.nav-footer__p {
    --line-height: 160%;
    margin-bottom: 1.6875rem;
    width: 19.4375rem;
}

@media (min-width: 640px) {
    .nav-footer__p {
        width: 28.875rem;
    }
}

.nav-footer__p_disclaimer {
    --font-size: 0.75rem;
    --line-height: 160%;
    letter-spacing: -0.24px;
}

.nav-footer__icon-bar__container {
    align-items: center;
    background-color: rgb(var(--white));
    display: flex;
    flex-direction: column;
    padding-bottom: 1.25rem;
    padding-top: 1.25rem;
}

    .nav-footer__icon-bar__container > a:not(:first-child) {
        padding-top: 1.75rem;
    }

@media (min-width: 640px) {
    .nav-footer__icon-bar__container {
        flex-wrap: nowrap;
        flex-direction: row;
        justify-content: space-evenly;
    }
}

@media (min-width: 640px) {
    .nav-footer__icon-bar__container > a:not(:first-child) {
        padding-left: 2.25rem;
        padding-top: 0rem;
    }
}

@media (min-width: 768px) {
    .nav-footer__icon-bar__container {
        flex-wrap: nowrap;
        justify-content: flex-start;
    }
}

.nav-footer__icon-bar__bottom {
    border-color: rgba(var(--black), 0.2);
    border-top-width: 0.0625rem;
    margin-top: 0rem;
}

.product-card-clamp {
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}

.product-card-suitable__span {
    font-family: var(--font-book);
}

.product-card-mortgage__header {
    --font-size: 1.75rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    width: 100%;
}

@media (min-width: 640px) {
    .product-card-mortgage__header {
        --font-size: 3rem;
        font-size: var(--font-size);
        letter-spacing: calc(var(--font-size) * -0.02);
        line-height: 110%;
    }
}

@media (min-width: 640px) {
    .product-card-mortgage__row-title {
        --font-size: 3rem;
        font-size: var(--font-size);
        letter-spacing: calc(var(--font-size) * -0.02);
        line-height: 110%;
    }
}

@media (min-width: 640px) {
    .product-card-mortgage__bullets-header {
        --font-size: 1.5rem;
        font-size: var(--font-size);
        letter-spacing: calc(var(--font-size) * -0.02);
    }
}

.product-card-mortgage__p {
    --font-size: 0.75rem;
    overflow-wrap: break-word;
}

@media screen and (min-width: 1024px) {

    .product-card-mortgage__p {
        --font-size: 0.875rem;
        margin-top: 1.25rem
    }
}

.product-card-mortgage__p-tooltip {
    display: flex;
    justify-content: flex-end;
}

.product-card-mortgage__endtext {
    width: 100%;
    height: auto;
    padding: 1.25rem;
    padding-right: 0.5rem;
    margin-top: 0;
    margin-bottom: 7rem;
    z-index: 1;
}

@media screen and (min-width: 640px) {

    .product-card-mortgage__endtext {
        padding-left: 3.5rem;
        padding-right: 3.5rem
    }
}

@media screen and (min-width: 1024px) {

    .product-card-mortgage__endtext {
        padding: 2.5rem;
        width: 60%;
        margin-bottom: -0.5rem
    }
}

.product-card-mortgage__rate-header {
    width: auto;
}

@media (min-width: 640px) {
    .product-card-mortgage__rate-header {
        --font-size: 1.5rem;
        font-size: var(--font-size);
        letter-spacing: calc(var(--font-size) * -0.02);
    }
}

.product-card-mortgage__rate-value__label {
    display: block;
    font-family: var(--font-heavy);
    --font-size: 1.875rem;
    margin-top: 0rem;
    position: relative;
    width: auto;
}

@media screen and (min-width: 640px) {

    .product-card-mortgage__rate-value__label {
        --font-size: 4rem;
        top: 0.25rem
    }
}

.product-card-mortgage__rate-percent__label {
    font-family: var(--font-heavy);
    --font-size: var(--font-span-large-default);
}

@media screen and (min-width: 640px) {

    .product-card-mortgage__rate-percent__label {
        --font-size: 2.25rem
    }
}

.product-card-mortgage__rate-caption {
    display: block;
    font-family: var(--font-book);
    --font-size: var(--font-span-small-default);
    position: relative;
    top: -0.25rem;
    width: auto;
}

@media screen and (min-width: 640px) {

    .product-card-mortgage__rate-caption {
        --font-size: var(--font-span-default)
    }
}

.product-card-mortage-suitable__li {
    margin-bottom: 0.5rem;
    overflow-wrap: break-word;
}

@media screen and (min-width: 640px) {

    .product-card-mortage-suitable__li {
        margin-left: 0.5rem
    }
}

.product-card-mortage-suitable__li:first-child {
    margin-top: 0rem;
}

.product-card-savings-product {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    position: relative;
}

.product-card-savings__header {
    --font-size: var(--font-h4-default);
}

@media (min-width: 640px) {

    .product-card-savings__header {
        --font-size: var(--font-h4-medium)
    }
}

@media (min-width: 1024px) {

    .product-card-savings__header {
        --font-size: var(--font-h4-large)
    }
}

.product-card-container {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 2.5rem 1.25rem;
    width: 100%;
    z-index: 1;
}

@media screen and (min-width: 640px) {

    .product-card-container {
        padding: 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .product-card-container {
        padding: 2.5rem 3rem
    }
}

.product-card-container .savings-header {
    display: flex;
    flex-direction: column;
    height: auto;
    padding-bottom: 1rem;
    width: 100%;
}

.product-card-container .content {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    height: auto;
}

@media screen and (min-width: 1280px) {

    .product-card-container .content {
        flex-wrap: nowrap;
        justify-content: center;
        width: 60rem
    }
}

.product-card-container .content .column {
    display: flex;
    flex-wrap: wrap;
}

@media screen and (min-width: 1280px) {

    .product-card-container .content .column {
        justify-content: space-between
    }
}

.product-card-container .content .content-first {
    padding-bottom: 2rem;
    width: 100%;
}

@media screen and (min-width: 768px) {

    .product-card-container .content .content-first {
        width: 50%
    }
}

@media screen and (min-width: 1280px) {

    .product-card-container .content .content-first {
        padding-bottom: 0rem;
        width: 40%
    }
}

.product-card-container .content .content-first .aertext {
    height: auto;
    margin-top: 0.75rem;
    width: 90%;
    z-index: inherit;
}

@media screen and (min-width: 640px) {

    .product-card-container .content .content-first .aertext {
        width: 60%
    }
}

@media screen and (min-width: 768px) {

    .product-card-container .content .content-first .aertext {
        width: 80%
    }
}

.product-card-container .content .content-second {
    padding-bottom: 2rem;
    width: 100%;
}

@media screen and (min-width: 768px) {

    .product-card-container .content .content-second {
        width: 50%
    }
}

@media screen and (min-width: 1280px) {

    .product-card-container .content .content-second {
        padding-bottom: 0rem;
        width: 30%
    }
}

.product-card-container .content .content-second .terms {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: auto;
}

.product-card-container .content .content-third {
    width: 100%;
}

@media screen and (min-width: 768px) {

    .product-card-container .content .content-third {
        width: 60%
    }
}

@media screen and (min-width: 1024px) {

    .product-card-container .content .content-third {
        position: relative
    }
}

@media screen and (min-width: 1280px) {

    .product-card-container .content .content-third {
        width: 30%
    }
}

.product-card-container .content .content-third ul {
    margin-bottom: 2.5rem;
}

@media screen and (min-width: 1024px) {

    .product-card-container .content .content-third ul {
        margin-left: 0
    }
}

.term-column {
    display: flex;
    flex-direction: column;
    width: 100%;
}

@media screen and (max-width: 375px) {

    .term-column button {
        width: 100%
    }
}

.product-card-savings__column__rate-header {
    --font-family: var(--font-body-copy);
    --font-size: var(--font-h6-default);
    --line-height: 160%;
    padding-bottom: 0.5rem;
}

@media (min-width: 640px) {

    .product-card-savings__column__rate-header {
        --font-size: var(--font-h6-medium)
    }
}

@media (min-width: 1024px) {

    .product-card-savings__column__rate-header {
        --font-size: var(--font-h6-large)
    }
}

.product-card-savings__column__header {
    --font-family: var(--font-body-copy);
    --font-size: var(--font-h6-default);
    font-weight: 400;
    --line-height: 160%;
    padding-bottom: 0.25rem;
}

@media (min-width: 640px) {

    .product-card-savings__column__header {
        --font-size: var(--font-h6-medium)
    }
}

@media (min-width: 1024px) {

    .product-card-savings__column__header {
        --font-size: var(--font-h6-large)
    }
}

.suitable-if-you {
    font-weight: bold;
}

.product-card-savings__mid-column-top__header {
    --font-size: var(--font-p-large);
    font-size: var(--font-size);
    width: 60%;
}

.product-card-savings__mid-column-bottom__header {
    --font-size: var(--font-p-large);
    font-size: var(--font-size);
    margin-top: 1.25rem;
}

@media (min-width: 1024px) {
    .product-card-savings__mid-column-bottom__header {
        width: 60%;
    }
}

.product-card-savings__p {
    --font-size: var(--font-p-subtitle);
    overflow-wrap: break-word;
}

.product-card-savings__rate-list__container {
    height: auto;
    width: 100%;
}

    .product-card-savings__rate-list__container .rate-list-item {
        align-items: flex-end;
        display: flex;
        flex: 0 1 auto;
        width: auto;
    }

.rate-divider:first-of-type {
    border-color: rgba(var(--black), 0.2);
    border-top-width: 0.0625rem;
    margin: 1.25rem 0rem;
    width: 100%;
}

@media screen and (min-width: 768px) {

    .rate-divider:first-of-type {
        width: 15rem
    }
}

.product-card-savings__rate-value__label {
    align-items: baseline;
    display: inline-flex;
    --font-size: var(--font-h3-default);
    font-weight: bold;
    --line-height: 120%;
    position: relative;
}

@media (min-width: 640px) {

    .product-card-savings__rate-value__label {
        --font-size: var(--font-h3-medium)
    }
}

@media (min-width: 1024px) {

    .product-card-savings__rate-value__label {
        --font-size: var(--font-h3-large)
    }
}

.product-card-savings__rate-type__label {
    font-family: var(--font-body-copy);
    --font-size: var(--font-p-default);
    margin-left: 0.5rem;
    width: 100%;
}

@media screen and (min-width: 380px) {

    .product-card-savings__rate-type__label {
        width: 50%
    }
}

@media screen and (min-width: 1024px) {

    .product-card-savings__rate-type__label {
        width: 33%
    }
}

.product-card-savings__caption {
    --font-size: var(--font-h5-default);
    font-weight: bold;
}

@media (min-width: 640px) {

    .product-card-savings__caption {
        --font-size: var(--font-h5-medium)
    }
}

@media (min-width: 1024px) {

    .product-card-savings__caption {
        --font-size: var(--font-h5-large)
    }
}

.product-card-savings-suitable__li {
    overflow-wrap: break-word;
}

    .product-card-savings-suitable__li:first-child {
        margin-top: 0rem;
    }

.product-card-at-a-glance {
    width: 100%;
    height: 50%;
}

.product-card-at-a-glance__container {
    display: flex;
    flex-direction: column;
    padding: 3rem 1.25rem;
}

@media screen and (min-width: 640px) {

    .product-card-at-a-glance__container {
        padding: 5rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .product-card-at-a-glance__container {
        padding: 5rem 6.9375rem
    }
}

@media screen and (min-width: 1280px) {

    .product-card-at-a-glance__container {
        padding: 5rem 12.1875rem
    }
}

@media screen and (min-width: 1440px) {

    .product-card-at-a-glance__container {
        padding: 5rem 17.1875rem
    }
}

.product-card-at-a-glance__content {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

@media screen and (min-width: 1024px) {

    .product-card-at-a-glance__content {
        flex-direction: row
    }
}

.product-card-at-a-glance__p-content {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    padding: 2rem;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .product-card-at-a-glance__p-content {
        width: 17.1875rem
    }
}

.product-card-at-a-glance__flex {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.product-card-at-a-glance__ul li {
    margin-bottom: 0.375rem;
}

.product-card-at-a-glance__header {
    padding-bottom: 1.75rem;
}

.product-card-at-a-glance__p-tagline {
    padding-bottom: 0.5rem;
}

.product-card-at-a-glance__p-number {
    padding-bottom: 0.5rem;
}

.product-card-half-height-card {
    display: inline-block;
    height: 19.5rem;
    overflow: hidden;
    width: 100%;
}

@media screen and (min-width: 640px) {

    .product-card-half-height-card {
        width: 39rem
    }
}

.product-card-half-height-card__content {
    height: 19.5rem;
    padding: 1.875rem;
    position: relative;
}

    .product-card-half-height-card__content .header {
        margin-bottom: 0.75rem;
    }

    .product-card-half-height-card__content .copy {
        display: -webkit-box;
        margin-bottom: 4.25rem;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
    }

    .product-card-half-height-card__content .ctaButton {
        bottom: 1.875rem;
        position: absolute;
    }

.product-card-half-height-alert svg {
    height: 1.5rem;
    width: 1.5rem;
}

.product-card-half-height-alert {
    margin-bottom: 1rem;
}

.half-height-card-alert-content {
    height: 100%;
    padding: 1.875rem;
}

.half-height-card-alert-content__button-row {
    align-items: flex-start;
    display: flex;
    justify-content: space-between;
}

    .half-height-card-alert-content__button-row div {
        position: relative;
    }

        .half-height-card-alert-content__button-row div svg {
            height: 2rem;
            width: 2rem;
        }

    .half-height-card-alert-content__button-row .close-hitbox {
        cursor: pointer;
    }

        .half-height-card-alert-content__button-row .close-hitbox svg {
            height: 1.5rem;
            stroke: currentcolor;
            width: 1.5rem;
        }

.half-height-card-alert-content__copy {
    display: flex;
    margin-top: 1rem;
}

.alertContent__p {
    color: rgb(var(--white));
    display: -webkit-box;
    overflow: hidden;
    padding-right: 1.875rem;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 10;
}

.product-card-suitable-for__header {
    margin-bottom: 0.75rem;
    width: 100%;
}

.product-card-suitable-for__sub-header {
    margin-bottom: 0.75rem;
    width: 100%;
}

.product-card-suitable-for__p {
    margin-bottom: 1.5rem;
}

.product-card-suitable-for__ul {
    font-size: var(--font-p-subtitle);
    margin-bottom: 2rem;
}

.product-card-event-list__header {
    margin-bottom: 1rem;
    -webkit-line-clamp: 3;
    width: 100%;
}

.product-card-event-section__title {
    width: 5rem;
}

@media (min-width: 768px) {
    .product-card-event-section__title {
        width: 6rem;
    }
}

.product-card-event-section__caption {
    font-weight: bold;
}

.mp-bg-placement-bl {
    transform-origin: center;
    transform: translateX(-13%) translateY(84%) rotate(41deg);
}

.mp-bg-placement-mobile {
    height: 60%;
    transform-origin: center;
    transform: translateX(-10%) translateY(-15%) rotate(19deg);
}

.mp-bg-placement-mobile-2 {
    height: 55%;
    transform-origin: center;
    transform: translateX(-10%) translateY(-15%) rotate(-19deg);
}

.product-card-background-top-left-down {
    transform-origin: center;
    transform: translateX(-50%) translateY(-75%) rotate(19deg);
}

.product-card-background-top-left-up {
    transform-origin: center;
    transform: translateX(-50%) translateY(-25%) rotate(-14deg);
}

.product-card-background-bottom-left {
    transform-origin: center;
    transform: translateX(-13%) translateY(84%) rotate(41deg);
}

.product-card-background-mobile {
    height: 60%;
    transform-origin: center;
    transform: translateX(-10%) translateY(-15%) rotate(19deg);
}

.product-card-background-mobile-2 {
    height: 55%;
    transform-origin: center;
    transform: translateX(-10%) translateY(-15%) rotate(-19deg);
}

.product-card-absolute-button {
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
}

.product-card-absolute-background {
    width: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
}

.product-section-savings__container {
    background-color: rgb(var(--white));
    height: auto;
    overflow: hidden;
    padding: 2.5rem 1.25rem;
    width: 100%;
}

@media (min-width: 640px) {

    .product-section-savings__container {
        padding: 2.5rem
    }
}

@media (min-width: 1024px) {

    .product-section-savings__container {
        padding: 3rem
    }
}

.product-section-savings__content_container {
    display: block;
}

@media (min-width: 1280px) {

    .product-section-savings__content_container {
        display: flex
    }
}

.product-section-savings__header {
    margin-bottom: 1.125rem;
}

.product-section-savings__rate__container {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

@media (min-width: 768px) {

    .product-section-savings__rate__container {
        flex-direction: row;
        gap: 2.5rem;
        justify-content: flex-start
    }
}

@media (min-width: 1024px) {

    .product-section-savings__rate__container {
        gap: 5rem
    }
}

.product-section-savings__aer-container {
    position: relative;
    width: fit-content;
}

@media screen and (min-width: 768px) {

    .product-section-savings__aer-container {
        width: 15rem
    }
}

.product-section-savings__aer-label {
    align-items: flex-end;
    display: flex;
    flex-direction: row;
}

@media screen and (min-width: 768px) {
    .product-section-savings__aer-label.additional-rate {
        bottom: 1rem;
        position: absolute;
    }
}

.product-section-savings__aer-caption {
    --font-size: 1.75rem;
    font-weight: bold;
    --line-height: 120%;
    margin-right: 0.5rem;
    margin-top: 0.25rem;
}

@media screen and (min-width: 1024px) {

    .product-section-savings__aer-caption {
        font-size: 2rem
    }
}

.product-section__flex-row__full-width {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

@media screen and (min-width: 640px) {

    .product-section__flex-row__full-width {
        flex-direction: row;
        gap: 2rem;
        justify-content: space-between
    }
}

.product-section-savings__title {
    --font-family: var(--font-body-copy);
    --font-size: 1.125rem;
    font-weight: 400;
    line-height: 160%;
}

.product-section-savings__rate-caption {
    --font-family: var(--font-body-copy);
    font-size: 1.375rem;
    font-weight: bold;
    max-width: 1rem;
}

@media screen and (min-width: 768px) {

    .product-section-savings__rate-caption {
        font-size: 1.5rem
    }
}

.product-section__flex-column__full-width {
    display: flex;
    flex-direction: column;
    margin-top: 1.25rem;
    width: 100%;
}

.product-section-savings__p {
    --font-size: 0.875rem;
    margin-top: 1.5rem;
}

@media screen and (min-width: 640px) {

    .product-section-savings__p {
        --font-size: 0.875rem
    }
}

@media screen and (min-width: 1024px) {

    .product-section-savings__p {
        width: 43.3125rem
    }
}

.product-section__term-info {
    display: flex;
    flex-direction: row;
    margin-top: 2rem;
}

@media screen and (min-width: 1280px) {

    .product-section__term-info {
        display: inline-block;
        margin-left: 7.5rem;
        margin-top: 0
    }
}

.product-section__flex-column {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    height: 100%;
}

@media (min-width: 640px) {

    .product-section__flex-column {
        flex-direction: row;
        gap: 3rem
    }
}

@media (min-width: 1280px) {

    .product-section__flex-column {
        flex-direction: column;
        gap: 1.25rem
    }
}

.product-section__divider {
    border-top: 1px solid;
    border-color: rgba(var(--black));
    opacity: 20%;
    margin-bottom: 1.25rem;
    margin-top: 1.25rem;
    width: 100%;
}

    .product-section__divider.last-rate {
        border-top-width: 0;
        margin-bottom: 0;
        margin-top: 0;
    }

.turnaround-times__container-full {
    height: auto;
    padding: 3rem 1.25rem;
}

@media (min-width: 640px) {
    .turnaround-times__container-full {
        padding: 5rem 2.5rem;
    }
}

@media (min-width: 1024px) {
    .turnaround-times__container-full {
        padding: 5rem 3rem;
    }
}

.turnaround-times__header {
    padding-bottom: 1.75rem;
}

.turnaround-times__container-content__ul {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: flex-start;
}

@media (min-width: 1024px) {
    .turnaround-times__container-content__ul {
        flex-direction: row;
    }
}

.turnaround-times__card {
    display: flex;
    flex-shrink: 0;
    margin-bottom: 0.5rem;
    overflow: hidden;
    padding: 2.25rem 2rem;
    position: relative;
    width: 21rem
}

@media (min-width: 1024px) {
    .turnaround-times__card {
        width: 23.5rem;
    }
}

.turnaround-times__card-content {
    display: flex;
    flex-direction: row;
    min-height: 8rem;
}

    .turnaround-times__card-content svg {
        flex-shrink: 0;
        height: 8.625rem;
        left: 15rem;
        opacity: 0.05;
        position: absolute;
        width: 8.625rem;
    }

@media (min-width: 1024px) {
    .turnaround-times__card-content svg {
        left: 17.5rem;
    }
}

.turnaround-times__content__li {
    flex-shrink: 0;
}

.turnaround-times__sub-header {
    --font-family: var(--font-body-copy);
    font-size: var(--font-p-default);
    letter-spacing: calc(var(--font-size, var(--font-p-default)) * -0.02);
    --line-height: 160%;
    padding-bottom: 0.5rem;
}

.turnaround-times__p-time {
    --font-size: var(--font-h3-default);
    font-weight: bold;
    --line-height: 120%;
    padding-bottom: 0.25rem;
}

@media (min-width: 640px) {

    .turnaround-times__p-time {
        --font-size: var(--font-h3-medium)
    }
}

@media (min-width: 1024px) {

    .turnaround-times__p-time {
        --font-size: var(--font-h3-large)
    }
}

.unique-selling-points__section__grid {
    background-color: rgb(var(--white));
    display: grid;
}

@media (min-width: 640px) {
    .unique-selling-points__section__grid {
        grid-auto-flow: column;
    }

    .unique-selling-point-block:nth-child(2n + 1) {
        grid-column: 1;
    }

    .unique-selling-point-block:nth-child(2n + 2) {
        grid-column: 2;
    }
}

@media screen and (min-width: 768px) {
    .unique-selling-points__section__grid {
        grid-auto-flow: column;
    }

    .unique-selling-point-block:nth-child(4n + 1) {
        grid-column: 1;
    }

    .unique-selling-point-block:nth-child(4n + 2) {
        grid-column: 2;
    }

    .unique-selling-point-block:nth-child(4n + 3) {
        grid-column: 3;
    }

    .unique-selling-point-block:nth-child(4n + 4) {
        grid-column: 4;
    }
}

.unique-selling-points__container__block {
    background-color: rgb(var(--primary-colour));
    padding: 3rem 1.25rem;
    width: 100%;
}

@media (min-width: 640px) {
    .unique-selling-points__container__block {
        padding: 4rem 2.5rem;
    }
}

@media (min-width: 1024px) {
    .unique-selling-points__container__block {
        padding: 5rem 3rem;
    }
}

.unique-selling-point-block {
    min-width: 10.25rem;
    padding: 2.5rem 1.25rem;
}

@media screen and (min-width: 640px) {

    .unique-selling-point-block {
        padding: 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .unique-selling-point-block {
        padding: 3rem
    }
}

.unique-selling-point-block h6 {
    margin-bottom: 0.25rem;
}

.unique-selling-points__point_multi_item {
    width: 100%;
}

.unique-selling-points__point_single_item {
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .unique-selling-points__point_single_item {
        width: 39rem
    }
}

.unique-selling-points__point__layout {
    align-items: center;
    display: flex;
    flex-direction: column;
}

.unique-selling-points__block {
    display: grid;
    gap: 3rem;
}

@media (min-width: 1024px) {

    .unique-selling-points__block {
        gap: 5rem
    }
}

@media (min-width: 1024px) {
    .unique-selling-points__block {
        padding-left: 3.5rem;
        padding-right: 3.5rem;
    }
}

.unique-selling-points__block.block__columns__1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

@media (min-width: 1024px) {
    .unique-selling-points__block.block__columns__2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .unique-selling-points__block.block__columns__3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .unique-selling-points__block.block__columns__4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.unique-selling-points__point {
    border-radius: 50%;
}

.unique-selling-points__point__single {
    height: 3.5rem;
    margin-bottom: 2rem;
    width: 3.5rem;
}

.unique-selling-points__point__block {
    height: 3.5rem;
    margin-bottom: 2rem;
    width: 3.5rem;
}

.unique-selling-points__header {
    color: rgb(var(--black));
    margin: auto;
    padding-bottom: 2.5rem;
    text-align: center;
    width: 75%;
}

@media screen and (min-width: 1024px) {

    .unique-selling-points__header {
        padding-bottom: 3rem
    }
}

@media (min-width: 768px) {
    .unique-selling-points__header {
        width: 80%;
    }
}

@media (min-width: 1024px) {
    .unique-selling-points__header {
        width: 75%;
    }
}

.unique-selling-points__sub-header {
    align-items: center;
    display: flex;
    margin-bottom: 1rem;
}

.unique-selling-points-block__sub-header {
    margin-bottom: 0.25rem;
    overflow-wrap: break-word;
    text-align: center;
    width: 100%;
}

.unique-selling-points-block__p {
    text-align: center;
}

.video-wrapper-container {
    width: 0px;
    height: 0px;
}

.video-wrapper {
    z-index: 0;
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    width: 100%;
}

    .video-wrapper iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

@media screen and (min-width: 1024px) {

    .video-block__container-full {
        height: 25.875rem
    }
}

@media screen and (min-width: 1280px) {

    .video-block__container-full {
        height: 27.25rem
    }
}

.video-block_container-full__video-only {
    height: 36rem;
}

.video-block__container {
    display: flex;
    flex-direction: column;
    height: 100%;
}

@media screen and (min-width: 1024px) {

    .video-block__container {
        flex-direction: row-reverse
    }
}

@media screen and (min-width: 1024px) {

    .video-block__container__video-left {
        flex-direction: row
    }
}

.video-block__container-image {
    z-index: 1;
    height: 36rem;
    overflow: hidden;
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
}

.video-block__container-image-with-text {
    height: 17.5rem;
}

@media screen and (min-width: 1024px) {

    .video-block__container-image-with-text {
        aspect-ratio: unset;
        height: 100%;
        width: 50%
    }
}

.video-block__image {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.video-block__play-button__container {
    height: 5rem;
    left: 50%;
    margin-left: -2.5rem;
    margin-top: -2.5rem;
    padding: 0.75rem;
    position: absolute;
    top: 50%;
    width: 5rem;
}

.video-block__container-text {
    display: flex;
    flex-shrink: 0;
    height: auto;
    padding: 5rem 1.25rem;
    width: 100%;
}

@media screen and (min-width: 640px) {

    .video-block__container-text {
        padding: 5rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .video-block__container-text {
        padding: 5rem 3.5rem 5rem 3rem;
        width: 50%
    }
}

@media screen and (min-width: 1280px) {

    .video-block__container-text {
        padding: 7.5rem 4.25rem 7.5rem 3rem
    }
}

@media screen and (min-width: 1024px) {

    .video-block__container-text__left {
        padding: 5rem 3rem 5rem 3.5rem
    }
}

@media screen and (min-width: 1280px) {

    .video-block__container-text__left {
        padding: 7.5rem 3rem 7.5rem 4.25rem
    }
}

.video-block__layout-text {
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    padding-bottom: 1.25rem;
    padding-top: 1.25rem;
}

@media screen and (min-width: 640px) {

    .video-block__layout-text {
        padding-top: 2rem;
        padding-bottom: 2rem
    }
}

@media screen and (min-width: 1024px) {

    .video-block__layout-text {
        padding-bottom: 0rem;
        padding-top: 0rem
    }
}

.video-block__p {
    margin-bottom: 2.5rem;
}

.filters__container-full {
    background-color: rgb(var(--light-grey-tint));
    color: rgb(var(--black));
    width: 100%;
    word-break: break-all;
}

.filters__container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
}

@media (min-width: 768px) {
    .filters__container {
        column-gap: 0.75rem;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: flex-start;
        width: 50%
    }
}

@media screen and (min-width: 1024px) {
    .filters__container {
        column-gap: 0.75rem;
        width: 100%;
    }
}

.filters-caption-alignment {
    margin-top: 1.25rem;
}

.featured-link {
    cursor: pointer;
    display: flex;
    height: 12.75rem;
    position: relative;
    width: 100%;
}

@media screen and (min-width: 640px) {

    .featured-link {
        height: 10.75rem
    }
}

.featured-link__image {
    display: none;
    overflow: hidden;
}

@media screen and (min-width: 1024px) {

    .featured-link__image {
        display: inline-block;
        width: 30%
    }
}

.featured-link__image img {
    height: 100%;
    object-fit: cover;
    transition: all 500ms cubic-bezier(0.4, 0, 0.2, 1);
    width: 100%;
}

.featured-link:hover .featured-link__image img {
    transform: scale(1.1, 1.1);
}

.featured-link__title {
    --font-size: var(--font-span-large-default);
    --font-family: var(--font-bold);
    justify-content: center;
    margin-left: 1.25rem;
    text-align: left;
}

@media screen and (min-width: 1024px) {

    .featured-link__title {
        --font-size: 3rem;
        margin-left: 5rem;
        margin-right: 5rem
    }
}

.featured-link__text {
    align-items: center;
    display: flex;
    justify-content: center;
    overflow: hidden;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .featured-link__text {
        width: 70%
    }
}

.featured-link__text div {
    align-items: center;
    display: flex;
    flex-basis: content;
    justify-content: center;
    padding: 4rem 2rem 4rem 2rem;
    text-align: left;
}

@media screen and (min-width: 640px) {

    .featured-link__text div {
        padding: 4rem 3.5rem 4rem 3.5rem
    }
}

@media screen and (min-width: 1024px) {

    .featured-link__text div {
        padding: 4rem 5rem 4rem 5rem
    }
}

.featured-link__text div .featured-link__label {
    display: inline-block;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    text-wrap: pretty;
}

.featured-link__text div svg {
    display: inline-block;
    flex-shrink: 0;
    height: var(--size);
    margin-left: 0.75rem;
    --size: 1rem;
    stroke: currentcolor;
    transition: transform 300ms ease-in-out;
    width: var(--size);
}

.featured-link:hover .featured-link__text svg {
    transform: translateX(0.625rem);
}

.featured-link:active .featured-link__text svg {
    transform: translateX(0.625rem);
}

.featured-link:focus .featured-link__text svg {
    transform: translateX(0.625rem);
}

.featured-link__text__no-image:hover svg {
    transform: translateX(0.625rem);
}

.featured-link__text__no-image:active svg {
    transform: translateX(0.625rem);
}

.featured-link__text__no-image:focus svg {
    transform: translateX(0.625rem);
}

.featured-link__text__no-image {
    align-items: center;
    display: flex;
    justify-content: center;
    width: 100%;
}

    .featured-link__text__no-image div {
        align-items: center;
        display: flex;
        flex-basis: content;
        justify-content: center;
        padding: 4rem 2rem 4rem 2rem;
        text-align: left;
    }

@media screen and (min-width: 640px) {

    .featured-link__text__no-image div {
        padding: 4rem 3.5rem 4rem 3.5rem
    }
}

@media screen and (min-width: 1024px) {

    .featured-link__text__no-image div {
        padding: 4rem 5rem 4rem 5rem
    }
}

.featured-link__text__no-image div .featured-link__label_no-image {
    display: inline-block;
    text-align: center;
    text-wrap: pretty;
}

.featured-link__text__no-image div svg {
    display: inline-block;
    flex-shrink: 0;
    height: var(--size);
    margin-left: 0.75rem;
    --size: 1rem;
    stroke: currentcolor;
    transition: transform 300ms ease-in-out;
    width: var(--size);
}

.anchor-link__nav-bar__container-full {
    overflow: auto;
    padding-left: 3rem;
}

.anchor-link__nav-bar__container-layout {
    height: 2.3125rem;
    width: 45rem;
}

@media screen and (min-width: 640px) {

    .anchor-link__nav-bar__container-layout {
        width: 100%
    }
}

.anchor-link__nav-bar__container-content {
    align-items: center;
    display: flex;
    gap: 1.75rem;
    height: 100%;
}

.anchor-link__nav-bar__a {
    align-items: center;
    display: flex;
    height: 1.8125rem;
}

    .anchor-link__nav-bar__a:focus-visible {
        outline-offset: -1px;
    }

.anchor-link__nav-bar__label {
    border-bottom-width: 0.125rem;
    border-color: transparent;
    --font-size: var(--font-p-large);
    transition: all 0.3s ease-in-out;
}

    .anchor-link__nav-bar__label:hover {
        font-weight: 700;
    }

    .anchor-link__nav-bar__label:active {
        border-color: rgba(var(--primary-colour));
    }

.anchor-link__tab-bar__container-full {
    overflow: auto;
}

.anchor-link__tab-bar__container-layout {
    background-color: rgb(var(--white));
    height: 3.75rem;
    width: 45rem;
}

@media screen and (min-width: 640px) {

    .anchor-link__tab-bar__container-layout {
        height: 4.3125rem;
        width: 100%
    }
}

.anchor-link__tab-bar__container-content {
    align-items: center;
    display: flex;
    height: 100%;
}

.anchor-link__tab-bar__a {
    background-color: rgb(var(--grey-light));
    border-bottom-width: 0.125rem;
    border-color: rgba(var(--black), 10%);
    display: flex;
    height: 100%;
    justify-content: center;
    padding-bottom: 1.25rem;
    padding-left: 2rem;
    padding-right: 2rem;
    padding-top: 1.25rem;
    width: 100%;
}

    .anchor-link__tab-bar__a.active {
        background-color: rgb(var(--white));
        border-color: rgb(var(--primary-colour));
    }

    .anchor-link__tab-bar__a:active {
        background-color: rgba(var(--secondary-light-colour-hover));
    }

    .anchor-link__tab-bar__a:focus-visible {
        outline-offset: -1px;
    }

    .anchor-link__tab-bar__a.active > span {
        font-weight: 700;
    }

    .anchor-link__tab-bar__a:last-child {
        border-right-width: 0px;
    }

    .anchor-link__tab-bar__a:hover {
        border-color: rgb(var(--primary-colour));
    }

.anchor-link__tab-bar__label {
    align-self: center;
    display: flex;
    --font-size: var(--font-p-large);
    white-space: nowrap;
}

.tab-bar__label {
    height: auto;
    width: auto;
    position: absolute;
    padding-left: 2rem;
    padding-right: 2rem;
    white-space: nowrap;
}

.tab__panels {
    display: flex;
    margin-left: 3.125rem;
    margin-right: 3.125rem;
}

.tab__panel {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}

    .tab__panel.ald-hidden {
        display: none;
    }

.tab__panel__card {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 2.5rem;
}

.tab__panel__card-content {
    display: flex;
    justify-content: flex-end;
    flex-direction: column;
}

.tab__panel__header {
    --font-size: 0.875rem;
    margin-top: 0.625rem;
    margin-bottom: 0.625rem;
    --font-family: var(--font-bold);
}

@media screen and (min-width: 640px) {

    .tab__panel__header {
        --font-size: 1.5rem;
        margin-top: 1.25rem;
        margin-bottom: 1.25rem;
        max-width: 40rem
    }
}

.tab__panel__card_header {
    margin-top: 0.625rem;
    margin-bottom: 0.625rem;
    max-width: 39.0625rem;
    --font-size: 0.75rem;
}

@media screen and (min-width: 640px) {

    .tab__panel__card_header {
        --font-size: 1.125rem;
        margin-top: 1.25rem;
        margin-bottom: 1.25rem
    }
}

.group {
    color: #FFFFFF;
}

.group-container {
    background-color: #00481E;
}

.social-icons-list__container {
    align-items: center;
    display: flex;
    justify-content: center;
    width: 100%;
}

/* @media (min-width: 1280px) {
  .social-icons-list__container {
    justify-content: flex-start;
  }
} */

.social-icons-list__item {
    margin-left: 0.75rem;
}

    .social-icons-list__item:first-child {
        margin-left: 0rem;
    }

@media (min-width: 375px) {
    .social-icons-list__item {
        margin-left: 1.75rem;
    }
}

@media (min-width: 640px) {
    .social-icons-list__item {
        margin-left: 1.5rem;
    }
}

.social-icons__a {
    align-items: center;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.social-icons__svg {
    display: block;
    flex: none;
    height: 2.5rem;
    width: 2.5rem;
}

.social-icons-caption__span {
    display: none;
    font-family: var(--font-body-copy);
    --font-size: 0.75rem;
}

@media (min-width: 768px) {
    .social-icons-caption__span {
        display: flex;
    }
}

.play-button {
    border-radius: 50%;
    border-style: none;
    cursor: pointer;
    flex-shrink: 0;
    height: 4.9375rem;
    width: 4.9375rem;
}

    .play-button > svg {
        flex-shrink: 0;
        height: 2.25rem;
        margin-left: 0.25rem;
        position: relative;
        stroke: rgb(var(--black));
        width: 2.25rem;
    }

        .play-button > svg:hover {
            color: rgb(var(--primary-colour));
        }

.ald_table__container {
    overflow-x: auto;
    width: 100%;
}

div.ald_table__container > table {
    background-color: rgb(var(--white));
    border: 0.0625rem solid rgba(var(--black), 0.2);
    color: rgb(var(--black));
    width: 100%;
}

    div.ald_table__container > table > tbody {
        width: 100%;
    }

    div.ald_table__container > table > thead, tbody > tr > th {
        background-color: rgb(var(--white));
        border-bottom: 0.0625rem solid rgba(var(--black), 0.2);
        color: rgb(var(--black));
        font-family: var(--font-body-copy);
        --font-size: 1rem;
        font-size: var(--font-size);
        letter-spacing: calc(var(--font-size) * -0.02);
        line-height: 160%; /* 25.6px */
        min-width: 9.375rem;
        --padding: 1rem;
        padding: var(--padding);
        text-align: left;
    }

    div.ald_table__container > table > tbody > tr > th {
        background-color: rgb(var(--white));
        border-bottom: 0.0625rem solid rgba(var(--black), 0.2);
        color: rgb(var(--black));
    }

    div.ald_table__container > table > thead, tbody {
        width: 100%;
    }

        div.ald_table__container > table > thead, tbody > tr {
            width: 100%;
        }

    div.ald_table__container > table:has(tbody) > tr > th:first-child {
        padding-left: 5.3125rem;
    }

    div.ald_table__container > table > thead > tr > td, th {
        font-family: var(--font-body-copy);
        --font-size: 1rem;
        font-size: var(--font-size);
        letter-spacing: calc(var(--font-size) * -0.02);
        line-height: 160%; /* 25.6px */
        min-width: 9.375rem;
        padding: 1rem;
    }

@media screen and (min-width: 768px) {

    div.ald_table__container > table > thead > tr > td, th {
        --font-size: 1rem;
        min-width: 12.5rem;
        padding: 1rem
    }
}

div.ald_table__container > table > tbody > tr > td, th {
    font-family: var(--font-body-copy);
    --font-size: 1rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    line-height: 160%; /* 25.6px */
    min-width: 9.375rem;
    padding: 1rem;
}

@media screen and (min-width: 768px) {

    div.ald_table__container > table > tbody > tr > td, th {
        --font-size: 1rem;
        min-width: 12.5rem;
        padding: 1rem
    }
}

div.ald_table__container > table > tbody > tr > td:first-child {
    padding-left: 5.3125rem;
}

div.ald_table__container > table > tbody > tr > th:first-child {
    padding-left: 5.3125rem;
}

div.ald_table__container > table > thead > tr > th:first-child {
    padding-left: 5.3125rem;
}

/* group table variant styling */

.group_page .ald_table__container__group {
    color: rgb(var(--white));
    overflow-x: auto;
    width: 100%;
}

.group_page div.ald_table__container > table {
    background-color: rgb(var(--group-colour));
    border: 0.0625rem solid rgba(var(--white), 0.2);
    color: rgb(var(--white));
    width: 100%;
}

    .group_page div.ald_table__container > table > tbody {
        width: 100%;
    }

    .group_page div.ald_table__container > table > thead > tr > th {
        background-color: rgb(var(--group-colour));
        border-bottom: 0.0625rem solid rgba(var(--white), 0.2);
        color: rgb(var(--white));
        font-family: var(--font-body-copy);
        --font-size: 1rem;
        font-size: var(--font-size);
        letter-spacing: calc(var(--font-size) * -0.02);
        line-height: 160%; /* 25.6px */
        min-width: 9.375rem;
        --padding: 1rem;
        padding: var(--padding);
        text-align: left;
    }

    .group_page div.ald_table__container > table > tbody > tr > th {
        background-color: rgb(var(--group-colour));
        border-bottom: 0.0625rem solid rgba(var(--white), 0.2);
        color: rgb(var(--white));
        font-family: var(--font-body-copy);
        --font-size: 1rem;
        font-size: var(--font-size);
        letter-spacing: calc(var(--font-size) * -0.02);
        line-height: 160%; /* 25.6px */
        min-width: 9.375rem;
        --padding: 1rem;
        padding: var(--padding);
        text-align: left;
    }

    .group_page div.ald_table__container > table > thead, tbody {
        width: 100%;
    }

        .group_page div.ald_table__container > table > thead, tbody > tr {
            width: 100%;
        }

    .group_page div.ald_table__container > table:has(tbody) > tr > th:first-child {
        padding-left: 5.3125rem;
    }

    .group_page div.ald_table__container > table > thead > tr > td, th {
        font-family: var(--font-body-copy);
        --font-size: 1rem;
        font-size: var(--font-size);
        letter-spacing: calc(var(--font-size) * -0.02);
        line-height: 160%; /* 25.6px */
        min-width: 9.375rem;
        padding: 1rem;
    }

@media screen and (min-width: 768px) {

    .group_page div.ald_table__container > table > thead > tr > td, th {
        --font-size: 1rem;
        min-width: 12.5rem;
        padding: 1rem
    }
}

.group_page div.ald_table__container > table > tbody > tr > td, th {
    font-family: var(--font-body-copy);
    --font-size: 1rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    line-height: 160%; /* 25.6px */
    min-width: 9.375rem;
    padding: 1rem;
}

@media screen and (min-width: 768px) {

    .group_page div.ald_table__container > table > tbody > tr > td, th {
        --font-size: 1rem;
        min-width: 12.5rem;
        padding: 1rem
    }
}

.group_page div.ald_table__container > table > tbody > tr > td:first-child {
    padding-left: 5.3125rem;
}

.group_page div.ald_table__container > table > tbody > tr > th:first-child {
    padding-left: 5.3125rem;
}

.group_page div.ald_table__container > table > thead > tr > th:first-child {
    padding-left: 5.3125rem;
}

.page-control-container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    column-gap: 1.875rem;
}

.page-control-container__column_3 {
    width: calc(33% - 1.875rem);
    min-width: 320px;
    flex-grow: 1;
}

.page-control-container__column_2 {
    width: calc(50% - 1.875rem);
    min-width: 320px;
    flex-grow: 1;
}

.page-control-container__column {
    display: flex;
    flex-direction: column;
}

.page-control-container__column_align-left {
    align-items: flex-start;
}

.page-control-container__column_align-centre {
    align-items: center;
}

.page-control-container__column_align-right {
    align-items: flex-end;
}

/**
 * Faux Box Link Object
 *
 * Base upon The Guardian implementation of this model.
 *
 * Example:
 *  <div class="box u-faux-box-link">
 *      <h1>This is a title</h1>
 *      <p>This is a standfirst paragraph
 *          <a class="u-faux-box-link__promote" href="https://bbc.co.uk">This is a link</a></p>
 *      <a href="https://studiobonito.co.uk" class="u-faux-link__overlay">Studio Bonito yo!</a>
 *  </div>
 *
 */

/* Base faux box link */

.u-faux-box-link {
    position: relative;
}

/* Overlay styling */

.u-faux-box-link__overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    text-indent: 200%;
    white-space: nowrap;
    background: transparent;
    z-index: 1;
}

/* The link that can be clicked on. */

.u-faux-box-link__promote {
    position: relative;
    z-index: 1;
}

.release-log-container-header {
    padding: 3rem 7.5rem 1.25rem;
}

.release-log-container-sprints {
    padding: 0 7.5rem;
}

.release-log-sprint-title {
    margin-bottom: 1.25rem;
}

.release-log-update {
    margin-bottom: 1.25rem;
}

.release-log-container-sprints:last-of-type {
    padding-bottom: 3rem;
}

:root {
    --icon-width-sm: 2rem;
    --icon-height-sm: 2rem;
    --icon-width-md: 2.5rem;
    --icon-height-md: 2.5rem;
    --icon-width-xl: 6.25rem;
    --icon-height-xl: 6.25rem;
    --stoke-white: rgb(var(--white));
    --stroke-black: rgb(var(--black));
    --ald-border-width: 2px;
}

*, :after, :before {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    border: 0 solid;
}

html {
    background-color: rgb(var(--grey-light));
}

body {
    max-width: 90rem;
    /* Need important here to override storybook default margin */
    margin: 0 auto !important;
    background-color: rgb(var(--white));
    /* Set the default pen colour to our defined black */
    color: rgb(var(--black));
}

.icon-sm {
    width: var(--icon-width-sm);
    height: var(--icon-height-sm);
}

.icon-md {
    width: var(--icon-width-md);
    height: var(--icon-height-md);
}

.icon-xl {
    width: var(--icon-width-xl);
    height: var(--icon-height-xl);
}

.icon-fill-white {
    color: rgb(var(--white));
}

.icon-fill-black {
    color: rgb(var(--black));
}

.svg {
    transition: all 0.2s;
}

.outer:active .svg {
    stroke: white;
}

.flex-column-container {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.hidden {
    display: none;
}

/* Sitewide margin and paddings */

.form-margin-top {
    margin-top: 1.25rem;
}

.form-margin-bottom {
    margin-bottom: 1.25rem;
}

.margin-bottom {
    margin-bottom: 1.25rem;
}

@media screen and (min-width: 640px) {
    .margin-bottom {
        margin-bottom: 2.5rem;
    }
}

@media screen and (min-width: 1024px) {
    .margin-bottom {
        margin-bottom: 3rem;
    }
}

.padding-side {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

@media screen and (min-width: 640px) {
    .padding-side {
        padding-left: 2.5rem;
        padding-right: 2.5rem;
    }
}

@media screen and (min-width: 1024px) {
    .padding-side {
        padding-left: 3rem;
        padding-right: 3rem;
    }
}

/* Left padding */

.padding-left {
    padding-left: 1.25rem;
}

@media screen and (min-width: 640px) {
    .padding-left {
        padding-left: 2.5rem;
    }
}

@media screen and (min-width: 1024px) {
    .padding-left {
        padding-left: 3rem;
    }
}

/* Right padding */

.padding-right {
    padding-right: 1.25rem;
}

@media screen and (min-width: 640px) {
    .padding-right {
        padding-right: 2.5rem;
    }
}

@media screen and (min-width: 1024px) {
    .padding-right {
        padding-right: 3rem;
    }
}

.margin-side {
    margin-left: 1.25rem;
    margin-right: 1.25rem;
}

@media screen and (min-width: 640px) {
    .margin-side {
        margin-left: 2.5rem;
        margin-right: 2.5rem;
    }
}

@media screen and (min-width: 1024px) {
    .margin-side {
        margin-left: 3rem;
        margin-right: 3rem;
    }
}

.stop-scrolling {
    height: 100%;
    overflow: hidden;
}

table {
    border-collapse: collapse;
}

.ios_colour_fix {
    color: rgb(var(--black));
}