/* Font-primary */
@font-face {
    font-family: 'Hitachi Sans';
    src: url("/assets-f/fonts/ef09ad6ad32462.woff");
    font-weight: 400;
}

@font-face {
    font-family: 'Hitachi Sans';
    src: url("/assets-f/fonts/ef09ad6ad32462.woff");
    font-weight: 500;
}

@font-face {
    font-family: 'Hitachi Sans';
    src: url("/assets-f/fonts/ef09ad6ad32462.woff");
    font-weight: 600;
}

@font-face {
    font-family: 'Hitachi Sans';
    src: url("/assets-f/fonts/ef09ad6ad32462.woff");
    font-weight: 700;
}


/* Font-secondary */
@font-face {
    font-family: 'Hitachi Sans';
    src: url("/assets-f/fonts/4ddb5553dfb515.woff");
    font-weight: 400;
}

@font-face {
    font-family: 'Hitachi Sans';
    src: url("/assets-f/fonts/4ddb5553dfb515.woff");
    font-weight: 500;
}

@font-face {
    font-family: 'Hitachi Sans';
    src: url("/assets-f/fonts/ef09ad6ad32462.woff");
    font-weight: 600;
}

@font-face {
    font-family: 'Hitachi Sans';
    src: url("/assets-f/fonts/ef09ad6ad32462.woff");
    font-weight: 700;
}


:root {
    /* Brand colours */
    --primary-color: #cc0022;
    --secondary-color: #b3b3b3;
    --tertiary-color: #4d4d4d;
    --bg-dark: #222222;
    --bg-light: #f4f4f4;

    /* Text colours */
    --label-dark: #4d4d4d;
    --label-light: #f4f4f4;
    --alternate-label-dark: #4d4d4d;
    --alternate-label-light: #f4f4f4;
    --headline-dark: #0c0c0c;
    --headline-light: #ffffff;
    --alternate-headline-dark: #cc0022;
    --alternate-headline-light: #ffffff;
    --body-text-dark: #4d4d4d;
    --body-text-light: #f4f4f4;
    --alternate-body-text-dark: #4d4d4d;
    --alternate-body-text-light: #f4f4f4;
    --footer-logo-size: 150px;
    --header-logo-scale: 1;

    /* UI elements colours */
    --extra-light-color: #f4f4f4;
    --light-color: #d9d9d9;
    --medium-color: #d9d9d9;
    --strong-color: #737373;

    /* Link colours */
    --link-color: #0c0c0c;
    --link-icon-color: #cc0022;
    --link-underline-color: #cc0022;
    --link-light-color: #ffffff;
    --link-light-icon-color: #ffffff;
    --link-light-underline-color: #ffffff;

    /* Buttons colours */
    --primary-button-color: #cc0022;
    --primary-button-text-color: #ffffff;
    --primary-button-hover-color: #0c0c0c;
    --primary-button-hover-text-color: #ffffff;
    --primary-button-outline-color: transparent;
    --primary-light-button-color: #cc0000;
    --primary-light-button-text-color: #ffffff;
    --primary-light-button-hover-color: #0c0c0c;
    --primary-light-button-hover-text-color: #ffffff;
    --primary-light-button-outline-color: transparent;
    --secondary-button-color: #ffffff;
    --secondary-button-text-color: #0c0c0c;
    --secondary-button-hover-color: #b3b3b3;
    --secondary-button-hover-text-color: #000000;
    --secondary-button-outline-color: #b3b3b3;
    --secondary-light-button-color: #ffffff;
    --secondary-light-button-text-color: #0c0c0c;
    --secondary-light-button-hover-color: #b3b3b3;
    --secondary-light-button-hover-text-color: #000000;
    --secondary-light-button-outline-color: #b3b3b3;
    --tertiary-button-color: #cc0000;
    --tertiary-button-text-color: #ffffff;
    --tertiary-button-hover-color: #0c0c0c;
    --tertiary-button-hover-text-color: #ffffff;
    --tertiary-button-outline-color: transparent;
    --tertiary-light-button-color: #cc0000;
    --tertiary-light-button-text-color: #ffffff;
    --tertiary-light-button-hover-color: #0c0c0c;
    --tertiary-light-button-hover-text-color: #ffffff;
    --tertiary-light-button-outline-color: transparent;

    /* Lightbox colours */
    --lightbox-bg-color: #222222;
    --lightbox-opacity: 70%;

    /* Table colours */
    --table-header-text-color: #0c0c0c;

    /* Header colours */
    --header-bar-color: #f4f4f4;
    --header-text-color: #4d4d4d;
    --header-hover-color: #0c0c0c;
    --header-underline-color: #cc0022;
    --header-separator-line: #d9d9d9;
    --utility-bar-color: #ffffff;
    --utility-text-color: #4d4d4d;
    --utility-hover-color: #4d4d4d;
    --share-price-color: #4d4d4d;
    --dropdown-nav-color: #f4f4f4;
    --dropdown-title-color: #0c0c0c;
    --dropdown-text-color: #4d4d4d;
    --dropdown-hover-color: #0c0c0c;

    /* Breadcrumbs colours */
    --breadcrumbs-bg-color: #ffffff;
    --breadcrumbs-text-color: #0c0c0c;
    --breadcrumbs-separator-line: #cc0022;

    /* Footer colours */
    --footer-bg-color: #f4f4f4;
    --footer-text-color: #0c0c0c;
    --copyright-bar-color: #d9d9d9;
    --copyright-text-color: #4d4d4d;
    --footer-accent-color: #cc0022;
    --footer-link-underline-color: #cc0022;
    --footer-separator-line: #b3b3b3;

    /* Footer Back to top button colours */
    --footer-button-color: var(--primary-button-color);
    --footer-button-text-color: var(--primary-button-text-color);
    --footer-button-hover-color: var(--primary-button-hover-color);
    --footer-button-hover-text-color: var(--primary-button-hover-text-color);
    --footer-button-outline-color: var(--primary-button-outline-color);

    /* Play video colours */
    --play-button-color: var(--primary-button-color);
    --play-button-text-color: var(--primary-button-text-color);
    --play-button-hover-color: var(--primary-button-hover-color);
    --play-button-hover-text-color: var(--primary-button-hover-text-color);
    --play-button-outline-color: var(--primary-button-outline-color);

    /* Lightbox button colours */
    --lightbox-button-color: var(--primary-button-color);
    --lightbox-button-text-color: var(--primary-button-text-color);
    --lightbox-button-hover-color: var(--primary-button-hover-color);
    --lightbox-button-hover-text-color: var(--primary-button-hover-text-color);
    --lightbox-button-outline-color: var(--primary-button-outline-color);

    /* Download image card button */
    --download-button-color: var(--primary-button-color);
    --download-button-text-color: var(--primary-button-text-color);
    --download-button-hover-color: var(--primary-button-hover-color);
    --download-button-hover-text-color: var(--primary-button-hover-text-color);
    --download-button-outline-color: var(--primary-button-outline-color);

    /* Download image popup button */
    --popup-download-button-color: var(--primary-button-color);
    --popup-download-button-text-color: var(--primary-button-text-color);
    --popup-download-button-hover-color: var(--primary-button-hover-color);
    --popup-download-button-hover-text-color: var(--primary-button-hover-text-color);
    --popup-download-button-outline-color: var(--primary-button-outline-color);

    /* Copy link button */
    --copy-link-color: var(--secondary-button-color);
    --copy-link-text-color: var(--secondary-button-text-color);
    --copy-link-hover-color: var(--secondary-button-hover-color);
    --copy-link-hover-text-color: var(--secondary-button-hover-text-color);
    --copy-link-outline-color: var(--secondary-button-outline-color);

    /* Search submit button */
    --search-button-color: var(--primary-button-color);
    --search-button-text-color: var(--primary-button-text-color);
    --search-button-hover-color: var(--primary-button-hover-color);
    --search-button-hover-text-color: var(--primary-button-hover-text-color);
    --search-button-outline-color: var(--primary-button-outline-color);

    /* Statistics Module Icon Width */
    --statistic-icon-width: 0px;

    /* Typography */
    --primary-font-family: 'Hitachi Sans';
    --secondary-font-family: 'Hitachi Sans';
    --primary-root-size: 16;
    --secondary-root-size: 18;
    --primary-letter-spacing: 0;
    --secondary-letter-spacing: 0;
    --primary-line-height: 1.2;
    --secondary-line-height: 1.4;

    --heading-font-weight: 600;
    --buttons-font-weight: 600;

    /* Typography parameters necessary for calculating a fluid grid for desktop - not editable */
    --window-width: 1920;
    --primary-ratio: calc(var(--window-width) / var(--primary-root-size));
    --secondary-ratio: calc(var(--window-width) / var(--secondary-root-size));
}

/* Button icons */
.icon--accordion-plus::after {
    content: '\f276';
}

.icon--accordion-minus::after {
    content: '\f271';
}

.icon--btn-right {
    display: block !important;
}

.icon--btn-right::after {
    content: '\f2ee';
}

.icon--link-right {
    display: block !important;
}

.icon--link-right::after {
    content: '\f1a3';
}

.icon--text-link-right {
    display: block !important;
}

.icon--text-link-right::after {
    content: '\f301';
}

.icon--add-calendar-right {
    display: block !important;
}

.icon--add-calendar-right::after {
    content: '\f32f';
}

.icon--copy-link-right {
    display: block !important;
}

.icon--copy-link-right::after {
    content: '\f18e';
}

.icon--download-right {
    display: block !important;
}

.icon--download-right::after {
    content: '\f220';
}

.icon--transcript-right {
    display: block !important;
}

.icon--transcript-right::after {
    content: '\f220';
}

.icon--back-to-top-right {
    display: block !important;
}

.icon--back-to-top-right::after {
    content: '\f303';
}

.icon--play-right {
    display: block !important;
}

.icon--play-right::after {
    content: '\f3a8';
}


/* Fluid font sizes for devices larger than 1200px */
@media screen and (min-width: 1200px) {
    .rte h1,
    .h1 {
      --max-desktop-size: calc(4.5rem * 1.4);
      --relative-size: calc(4.5 * 100vw / var(--primary-ratio));
      font-size: clamp(3.75rem, var(--relative-size), var(--max-desktop-size));
    }

    .rte h2,
    .h2 {
      --max-desktop-size: calc(3.75rem * 1.4);
      --relative-size: calc(3.75 * 100vw / var(--primary-ratio));
      font-size: clamp(2.5rem, var(--relative-size), var(--max-desktop-size));
    }

    .rte h3,
    .h3 {
      --max-desktop-size: calc(3rem * 1.4);
      --relative-size: calc(3 * 100vw / var(--primary-ratio));
      font-size: clamp(2rem, var(--relative-size), var(--max-desktop-size));
    }

    .rte h4,
    .h4 {
      --max-desktop-size: calc(2.25rem * 1.4);
      --relative-size: calc(2.25 * 100vw / var(--primary-ratio));
     font-size: clamp(1.75rem, var(--relative-size), var(--max-desktop-size));
    }

    .rte h5,
    .h5 {
      --max-desktop-size: calc(1.875rem * 1.4);
      --relative-size: calc(1.875 * 100vw / var(--primary-ratio));
      font-size: clamp(1.25rem, var(--relative-size), var(--max-desktop-size));
    }

    .rte h6,
    .h6 {
      --max-desktop-size: calc(1.25rem * 1.4);
      --relative-size: calc(1.25 * 100vw / var(--primary-ratio));
      font-size: clamp(1.125rem, var(--relative-size), var(--max-desktop-size));
    }

    .rte p,
    .text {
      --max-desktop-size: calc(1rem * 1.4);
      --relative-size: calc(1 * 100vw / var(--secondary-ratio));
      font-size: clamp(1rem, var(--relative-size), var(--max-desktop-size));
    }

    .rte .standfirst,
    .standfirst {
      --max-desktop-size: calc(1.25rem * 1.4);
      --relative-size: calc(1.25 * 100vw / var(--secondary-ratio));
      font-size: clamp(1.25rem, var(--relative-size), var(--max-desktop-size));
    }

    .rte .text-large,
    .text-large {
      --max-desktop-size: calc(1.125rem * 1.4);
      --relative-size: calc(1.125 * 100vw / var(--secondary-ratio));
      font-size: clamp(1.125rem, var(--relative-size), var(--max-desktop-size));
    }

    .rte .text-small,
    .text-small {
      --max-desktop-size: calc(0.875rem * 1.4);
      --relative-size: calc(0.875 * 100vw / var(--secondary-ratio));
      font-size: clamp(0.875rem, var(--relative-size), var(--max-desktop-size));
    }

    .rte .caption,
    .caption {
      --max-desktop-size: calc(0.75rem * 1.4);
      --relative-size: calc(0.75 * 100vw / var(--secondary-ratio));
      font-size: clamp(0.75rem, var(--relative-size), var(--max-desktop-size));
    }

    .rte .btn,
    .btn {
      --max-desktop-size: calc(1rem * 1.4);
      --relative-size: calc(1 * 100vw / var(--primary-ratio));
      font-size: clamp(1rem, var(--relative-size), var(--max-desktop-size));
    }

    .rte .btn--sm,
    .btn--sm {
      --max-desktop-size: calc(0.875rem * 1.4);
      --relative-size: calc(0.875 * 100vw / var(--primary-ratio));
      font-size: clamp(0.875rem, var(--relative-size), var(--max-desktop-size));
    }
}

/* Header and Footer Logo */
@media screen and (min-width: 1200px) {
    .header__logo {
      --max-desktop-size-width: calc(140px * var(--header-logo-scale));
      --max-desktop-size-height: calc(40px * var(--header-logo-scale));
      --max-desktop-size-margin: calc(-10px * var(--header-logo-scale));
      --relative-size-width: calc(((140 * var(--header-logo-scale)) * 100vw) / var(--window-width));
      --relative-size-height: calc(((40 * var(--header-logo-scale)) * 100vw) / var(--window-width));
      --relative-size-margin: calc(((-10 * var(--header-logo-scale)) * 100vw) / var(--window-width));
        width: clamp(calc(var(--max-desktop-size-width) * 0.75), var(--relative-size-width), var(--max-desktop-size-width));
        max-height: clamp(calc(var(--max-desktop-size-height) * 0.75), var(--relative-size-height), var(--max-desktop-size-height));
        margin-top: clamp(var(--max-desktop-size-margin), var(--relative-size-margin), calc(var(--max-desktop-size-margin) * 0.75));
        margin-bottom: clamp(var(--max-desktop-size-margin), var(--relative-size-margin), calc(var(--max-desktop-size-margin) * 0.75));
    }
}

@media screen and (max-width: 1199px) {
    .header__logo {
        width: calc(140px * var(--header-logo-scale));
        max-height: calc(40px * var(--header-logo-scale));
        margin-top: calc(-10px * var(--header-logo-scale));
        margin-bottom: calc(-10px * var(--header-logo-scale));
    }
}

@media screen and (min-width: 1200px) {
    .footer__logo {
    --footer-logo-var: 150;
      --relative-size: calc((var(--footer-logo-var) * 100vw) / var(--window-width));
     width: clamp(calc(var(--footer-logo-size) * 0.75), var(--relative-size), var(--footer-logo-size));
    }
}
@media screen and (min-width: 1200px) {
    .statistics__icon {
    --statistic-icon-var: 0;
      --relative-size: calc((var(--statistic-icon-var) * 100vw) / var(--window-width));
     width: clamp(calc(var(--statistic-icon-width) * 0.75), var(--relative-size), var(--statistic-icon-width));
    }
}