:root {
    /* Frontend colors */
    --body-colour: #214255;
    --primary-colour: #4DD4EA;
    --primary-colour-hover: #39bfd4;
    --primary-colour-light: #f0f5f7;
    --secondary-colour: #E8399A;
    --secondary-colour-hover: #d82d8c;
    --secondary-colour-trans: rgb(232 57 154 / 25%);
    --gradient-main: linear-gradient(176deg, #4DD4EA, #E8399A 62%, #ec9126);
    --gradient-primary-subtle: linear-gradient(176deg, #66dced, #4dd4ea 55%, #3fc6df);
    --gradient-secondary-subtle: linear-gradient(176deg, #ef60ad, #E8399A 58%, #d82d8c);
    --gradient-info-subtle: var(--gradient-secondary-subtle);
    --primary-colour-contrast: #ffffff;
    --dark-colour: #1f4d64;
    --dark-colour-contrast: #ffffff;
    --link-colour: var(--secondary-colour);
    --link-colour-hover: color-mix(in srgb, var(--link-colour) 70%, white);

    /* Frontend structural/theme vars (moved from bulma.css) */
    --main-font: 'Nunito';
    --container-width: var(--default-containerWidth);
    --border-radius: 20px;
    --button-radius: 53px;
    --button-height: 3.2rem;
    --logo-max-width: 100%;
    --logo-max-height: 120px;
    --body-background: #ffffff;
    --header-background: #ffffff;
    --footer-background: var(--dark-colour);
    --nav-link-colour: var(--heading-colour);
    --nav-link-colour-hover: var(--primary-colour);
    --nav-arrow-colour: var(--primary-colour);
    --heading-font: 'Nunito';
    --heading-weight: 900;
    --heading-spacing: -0.5px;
    --heading-colour: var(--dark-colour);

    /* Base sizes */
    --heading-size-1: 45pt;
    --heading-size-2: 28pt;
    --heading-size-3: 21pt;
    --heading-size-4: 18pt;
    --heading-size-5: 15pt;

    /* Scale factors */
    --scale-min: 0.8;
    --scale-max: 1.1;
    --heading-min-4: 20px;
    --heading-min-5: 18px;

    /* Line heights */
    --heading-line-height-1: 1.1;
    --heading-line-height-2: 1.1;
    --heading-line-height-3: 1.25;
    --heading-line-height-4: 1.2;
    --heading-line-height-5: 1.3;

    /* Navbar defaults */
    --nav-background: transparent;
    --nav-shadow: none;
    --nav-font-size: 17px;
    --nav-font-weight: 600;
    --nav-letter-spacing: 0.3px;
    --nav-line-height: 1.3;
    --nav-mobile-margin: 0.75rem;
    --nav-dropdown-background: #ffffff;
    --nav-dropdown-shadow: 0 8px 8px rgb(10 10 10 / 4%);
    --nav-dropdown-border-radius: var(--border-radius);
    --nav-dropdown-width: 240px;

    /* Nested dropdown vars */
    --nav-nested-dropdown-width: 200px;
    --nav-nested-dropdown-offset: 0px;
    --nav-nested-arrow-size: 0.4em;

    /* Supporting greys */
    --grey-light: #f5f5f5;
    --grey-border: #e0e0e0;
    --grey-dark: #3a3a3a;

    /* CMS aliases */
    --colour-main: var(--primary-colour);
    --colour-main-hover: var(--primary-colour-hover);
    --colour-main-trans: rgb(77 212 234 / 25%);
    --colour-secondary: var(--secondary-colour);
    --colour-secondary-hover: var(--secondary-colour-hover);
    --colour-secondary-trans: var(--secondary-colour-trans);
    --colour-dark: var(--dark-colour);
}
