/* Spacing variables*/
:root{

    --spacing-none: 0;
    
    --spacing-xxs:0.4rem;
    
    --spacing-xs:0.8rem;
    
    --spacing-sm: 1.2rem;
    
    --spacing-md: 1.6rem;
    
    --spacing-lg: 2rem;
    
    --spacing-xl: 2.4rem;
    
    --spacing-xxl:3.2rem;
    
    --spacing-xxxl:4.8rem;
    
    --fiord: #3F5769;
    
    --aquaHaze:#ecf5f5;
    
    --hippieBlue:#479c9c;
    
    --easternBlue:#1f8e9f;
    
    --nileBlue-bg:#19374E;
    
    --white: #fff;
    
    --black-: #1E1F20;
    
    --grey50: #F7F8F8;
    
    --grey100: #EDEEF1;
    
    --grey200: #D8DBDF;
    
    --grey300: #B6BAC3;
    
    --grey400: #8E95A2;
    
    --grey500: #6B7280;
    
    --grey600: #5B616E;
    
    --grey700: #4A4E5A;
    
    --grey800: #40444C;
    
    --grey900: #383A42;
    
    --grey950: #25272C;
    
    --sunglow50: #FFF5DB;
    
    --sunglow200: #FFE3AC;
    
    --sunglow400: #FFE3AC;
    
    --sunglow500: #FAC141;
    
    --sunglow600: #BB7B1C;
    
    --sunglow700: #7C561A;
    
    --sunglow900: #493B26;
    
    --aqua50: #E4F7F8;
    
    --aqua200: #BCEEEF;
    
    --aqua400: #69C8CF;
    
    --aqua500: #24AEB8;
    
    --aqua600: #048593;
    
    --aqua700: #00535B;
    
    --aqua900: #0A3034;
    
    --slate50: #EEF4FF;
    
    --slate200: #D1DEF3;
    
    --slate400: #ACC1E3;
    
    --slate500: #8AA3CE;
    
    --slate600: #6981AA;
    
    --slate700: #536C96;
    
    --slate900: #3B4A63;
    
    --carnation: #F55D51;
    
    --treePoppy:#FFA016;
    
    --fern:#5BB65F;
    
    --pictonBlue: #349FF3;
    
    --espresso:#631D18;
    
    --antiqueBronze:#6B4208;
    
    --everglade:#29502B;
    
    --madison: #0D3C61;
    
    --provincialPink:#FDECEA;
    
    --serenade:#FFF4E5;
    
    --panache:#EDF7ED;
    
    --hawkesBlue:#E8F4FD;
    
    --sanJuan:#33496C;
    
    --finn:#69324A;
    
    --sepia: #6F4515;
    
    --studio:#754DA8;
    
    --crete:#617529;
    
    --paradiso:#296E70;
    
    --pastelPink: #FFCAE1;
    
    --perfume: #D6BAF9;
    
    --primRose: #D6EC97;
    }
    html {
        font-size: 9px;
      }
      body {
        margin: unset;
      }
      .bf-row {
        display: flex;
        flex-direction: row;
        align-items: center;
      }
      .bf-col {
        display: flex;
        flex-direction: column;
        align-items: center;
      }
    
    /* Fonts */
    .bf-h1{
        font-family: 'Signika';
        font-size: 4.8rem;
        font-style: normal;
        font-weight: 500;
        line-height: 4.8rem;
    }
    .bf-h2{
        font-family: 'Signika';
        font-size: 2.4rem;
        font-style: normal;
        font-weight: 500;
        line-height: 2.8rem;
    
    }
    .bf-h3{
        font-family: 'Signika';
        font-size: 2rem;
        font-style: normal;
        font-weight: 400;
        line-height: 2.4rem;
    }
    .bf-h4{
        font-family: 'Signika';
        font-size: 1.8rem;
        font-style: normal;
        font-weight: 400;
        line-height: 2rem;
    }
    
    .bf-h5{
        font-family: 'Source Sans 3';
        font-size: 2.4rem;
        font-style: normal;
        font-weight: 400;
        line-height: 2.6rem;
    }
    .bf-h6{
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 500;
        line-height: 2.4rem;
    }
    .bf-h7{
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 400;
        line-height: 2.8rem;
    }
    .bf-h8{
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 700;
        line-height: 1.8rem;
    }
    .bf-h9{
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 600;
        line-height: 1.8rem;
    }
    .bf-h10{
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 500;
        line-height: 1.8rem;
    }
    .bf-h11{
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 400;
        line-height: 1.8rem;
    }
    .bf-h12{
        font-family: 'Source Sans 3';
        font-size: 1.4rem;
        font-style: normal;
        font-weight: 700;
        line-height: 1.6rem;
    }
    .bf-h13{
        font-family: 'Source Sans 3';
        font-size: 1.4rem;
        font-style: normal;
        font-weight: 600;
        line-height: 1.6rem;
    }
    .bf-h14{
        font-family: 'Source Sans 3';
        font-size: 1.4rem;
        font-style: normal;
        font-weight: 500;
        line-height: 1.6rem;
    }
    .bf-h15{
        font-family: 'Source Sans 3';
        font-size: 1.4rem;
        font-style: normal;
        font-weight: 400;
        line-height: 1.6rem;
    }
    .bf-h16{
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 1.4rem;
    }
    .bf-h17{
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 400;
        line-height: 1.4rem;
    }
    
    .bf-h18{
        font-family: 'Source Sans 3';
        font-size: 3.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 3.4rem;
    }
    .bf-h19{
        font-family: 'Source Sans 3';
        font-size: 3.2rem;
        font-style: normal;
        font-weight: 400;
        line-height: 3.4rem;
    }
    
    /* Corner Radius */
    .corner-radius{
        border-radius: 0.8rem;
    }
    /* mobile */
    /* .corner-radius{
        border-radius: 1.2rem;
    } */
    
    /* tablet
    .corner-radius{
        border-radius: 1.6rem;
    } */
    .corner-radius{
        border-radius: 4.8rem;
    }
    .corner-radius{
        border-radius: 0.8rem;
    }
    /* Colors */
    *{
        color: #3F5769;
    }
    
    /* Buttons */
    
    .bf-btns{
        border: none;
        border-radius: 4.5rem;
        display: inline-flex;
        height: 4.8rem;
        padding: 1.6rem 2.4rem;
        justify-content: center;
        align-items: center;
    }
    
    .circle{
        display: flex;
        width: 4.8rem;
        height: 4.8rem;
        padding: var(--spacing-spacing-md, 1.6rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.8rem);
        flex-shrink: 0;
        border-radius: 6rem;
        border: 2px solid;
    }
    
    input[type=text]{
        display: flex;
        padding: var(--spacing-spacing-xs, 0.8rem) 1.6rem;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.8rem);
        align-self: stretch;
        border-radius: var(--corner-radius-corner-radius-mobile, 0.8rem);
        border: 1px solid var(--colour-surface-surface-stroke-tertiary, #ACC1E3);
        background: var(--colour-surface-surface-primary, #FFF);
    }
    select{
        border-radius: 0.8rem;
        border: 0.5px solid var(--easternBlue);
        background: #FFF;
        width: 5.7rem;
        height: 2.6rem;
        flex-shrink: 0;
    }
    
    
    .input-correct {
        display: flex;
        height: 2.5rem;
        padding: var(--spacing-spacing-xs, 0.5rem) 1rem;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.5rem);
        align-self: stretch;
        border-radius: var(--corner-radius-corner-radius-mobile, 0.5rem);
        border: 1px solid var(--colour-surface-surface-stroke-tertiary, #ACC1E3);
        background: var(--colour-surface-surface-primary, #FFF);
    }
    .input-label-correct {
        height: 1.25rem;
        align-self: stretch;
        color: var(--colour-text-text-secondary, #6981AA);
        font-family: 'Source Sans 3';
        font-size: 0.75rem;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
    }
    .input-incorrect {
        display: flex;
        height: 2.5rem;
        padding: var(--spacing-spacing-xs, 0.5rem) 1rem;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.5rem);
        align-self: stretch;
        border-radius: var(--corner-radius-corner-radius-mobile, 0.5rem);
        border: 1px solid var(--colour-alert-alert-icon-error, #F55D51);
        background: var(--colour-surface-surface-primary, #FFF);
    }
    .input-label-incorrect {
        height: 1.25rem;
        align-self: stretch;
        color: var(--colour-alert-alert-icon-error, #F55D51);
        font-family: 'Source Sans 3';
        font-size: 0.75rem;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
    }
    .input-error {
        flex: 1 0 0;
        color: var(--colour-alert-alert-icon-error, #F55D51);
        font-family: Inter;
        font-size: 0.625rem;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
    }

    .primary-large {
        display: inline-flex;
        height: 4.8rem;
        padding: var(--spacing-spacing-md, 1.6rem) var(--spacing-spacing-xl, 2.4rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.8rem);
        flex-shrink: 0;
        border-radius: 4.5rem;
        background: var(--colour-buttons-surface-fill-surface-primary, #3F5769);
        color: var(--sunglow500);
        text-align: right;
  
        /* Button Font/Large */
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 1.25rem */
        letter-spacing: 0.0375rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .primary-large:hover {
        display: inline-flex;
        height: 4.8rem;
        padding: var(--spacing-spacing-md, 1.6rem) var(--spacing-spacing-xl, 2.4rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.8rem);
        flex-shrink: 0;
        border-radius: 4.5rem;
        background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%), var(--colour-buttons-surface-fill-surface-primary, #3F5769);
        color: var(--sunglow500);
        text-align: right;
  
        /* Button Font/Large */
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 1.25rem */
        letter-spacing: 0.0375rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .primary-large-disabled {
        pointer-events: none;
        display: inline-flex;
        height: 4.8rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-xl, 1.5rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.5rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: var(--colour-buttons-surface-fill-surface-disabled,
            #D8DBDF);
  
        color: var(--colour-buttons-text-label-disabled, #B6BAC3);
        text-align: right;
  
        /* Button Font/Large */
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 1.25rem */
        letter-spacing: 0.0375rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .primary-medium {
        display: inline-flex;
        height: 3.6rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-lg, 1.25rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.5rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: var(--colour-buttons-surface-fill-surface-primary,
            #3F5769);
        color: var(--sunglow500);
        text-align: right;
  
        /* Button Font/Medium */
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 600;
        line-height: 120%;
        /* 1.2rem */
        letter-spacing: 0.02rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .primary-medium:hover {
        display: inline-flex;
        height: 3.6rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-lg, 1.25rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.5rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%), var(--colour-buttons-surface-fill-surface-primary, #3F5769);
        color: var(--sunglow500);
        text-align: right;
  
        /* Button Font/Medium */
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 600;
        line-height: 120%;
        /* 1.2rem */
        letter-spacing: 0.02rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .primary-medium-disabled {
        pointer-events: none;
        display: inline-flex;
        height: 3.6rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-lg, 1.25rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.5rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: var(--colour-buttons-surface-fill-surface-disabled,
            #D8DBDF);
        color: var(--colour-buttons-text-label-disabled, #B6BAC3);
        text-align: right;
  
        /* Button Font/Medium */
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 600;
        line-height: 120%;
        /* 1.2rem */
        letter-spacing: 0.02rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
  
      .primary-small {
        display: inline-flex;
        height: 3rem;
        padding: var(--spacing-spacing-md, 1rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.5rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: var(--colour-buttons-surface-fill-surface-primary,
            #3F5769);
        color: var(--sunglow500);
        text-align: right;
        font-feature-settings: 'clig' off, 'liga' off;
  
        /* Button Font/Small */
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 0.875rem */
        letter-spacing: 0.00875rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .primary-small:hover {
        display: inline-flex;
        height: 3rem;
        padding: var(--spacing-spacing-md, 1rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.5rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%), var(--colour-buttons-surface-fill-surface-primary, #3F5769);
        color: var(--sunglow500);
        text-align: right;
        font-feature-settings: 'clig' off, 'liga' off;
  
        /* Button Font/Small */
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 0.875rem */
        letter-spacing: 0.00875rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .primary-small-disabled {
        pointer-events: none;
        display: inline-flex;
        height: 3rem;
        padding: var(--spacing-spacing-md, 1rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.5rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: var(--colour-buttons-surface-fill-surface-disabled,
            #D8DBDF);
        color: var(--colour-buttons-text-label-disabled, #B6BAC3);
        text-align: right;
        font-feature-settings: 'clig' off, 'liga' off;
  
        /* Button Font/Small */
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 0.875rem */
        letter-spacing: 0.00875rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
  
      .secondary-large {
        display: inline-flex;
        height: 4.8rem;
        padding: 1rem 1.5rem;
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: var(--colour-buttons-surface-fill-surface-secondary,
            #FAC141);
        color: var(--colour-buttons-text-label-secondary, #3F5769);
        text-align: right;
  
        /* Button Font/Large */
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 1.25rem */
        letter-spacing: 0.0375rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .secondary-large:hover {
        display: inline-flex;
        height: 4.8rem;
        padding: 1rem 1.5rem;
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: linear-gradient(0deg, rgba(255, 255, 255, 0.20) 0%, rgba(255, 255, 255, 0.20) 100%), var(--colour-buttons-surface-fill-surface-secondary, #FAC141);
        color: var(--colour-buttons-text-label-secondary, #3F5769);
        text-align: right;
  
        /* Button Font/Large */
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 1.25rem */
        letter-spacing: 0.0375rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .secondary-large-disabled {
        pointer-events: none;
        display: inline-flex;
        height: 4.8rem;
        padding: 1rem 1.5rem;
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: var(--colour-buttons-surface-fill-surface-disabled,
            #D8DBDF);
  
        color: var(--colour-buttons-text-label-disabled, #B6BAC3);
        text-align: right;
  
        /* Button Font/Large */
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 1.25rem */
        letter-spacing: 0.0375rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .secondary-medium {
        display: inline-flex;
        height: 3.6rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-lg, 1.25rem);
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: var(--colour-buttons-surface-fill-surface-secondary,
            #FAC141);
        color: var(--colour-buttons-text-label-secondary, #3F5769);
        text-align: right;
  
        /* Button Font/Medium */
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 600;
        line-height: 120%;
        /* 1.2rem */
        letter-spacing: 0.02rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .secondary-medium:hover {
        display: inline-flex;
        height: 3.6rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-lg, 1.25rem);
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: linear-gradient(0deg, rgba(255, 255, 255, 0.20) 0%, rgba(255, 255, 255, 0.20) 100%), var(--colour-buttons-surface-fill-surface-secondary, #FAC141);
        color: var(--colour-buttons-text-label-secondary, #3F5769);
        text-align: right;
  
        /* Button Font/Medium */
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 600;
        line-height: 120%;
        /* 1.2rem */
        letter-spacing: 0.02rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .secondary-medium-disabled {
        pointer-events: none;
        display: inline-flex;
        height: 3.6rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-lg, 1.25rem);
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: var(--colour-buttons-surface-fill-surface-disabled,
            #D8DBDF);
        color: var(--colour-buttons-text-label-disabled, #B6BAC3);
        text-align: right;
  
        /* Button Font/Medium */
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 600;
        line-height: 120%;
        /* 1.2rem */
        letter-spacing: 0.02rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .secondary-small {
        display: inline-flex;
        height: 3rem;
        padding: var(--spacing-spacing-md, 1rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-none, 0rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: var(--colour-buttons-surface-fill-surface-secondary,
            #FAC141);
        color: var(--colour-buttons-text-label-secondary, #3F5769);
        text-align: right;
        font-feature-settings: 'clig' off, 'liga' off;
  
        /* Button Font/Small */
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 0.875rem */
        letter-spacing: 0.00875rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .secondary-small:hover {
        display: inline-flex;
        height: 3rem;
        padding: var(--spacing-spacing-md, 1rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-none, 0rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: linear-gradient(0deg, rgba(255, 255, 255, 0.20) 0%, rgba(255, 255, 255, 0.20) 100%), var(--colour-buttons-surface-fill-surface-secondary, #FAC141);
        color: var(--colour-buttons-text-label-secondary, #3F5769);
        text-align: right;
        font-feature-settings: 'clig' off, 'liga' off;
  
        /* Button Font/Small */
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 0.875rem */
        letter-spacing: 0.00875rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .secondary-small-disabled {
        pointer-events: none;
        display: inline-flex;
        height: 3rem;
        padding: var(--spacing-spacing-md, 1rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-none, 0rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: var(--colour-buttons-surface-fill-surface-disabled,
            #D8DBDF);
        color: var(--colour-buttons-text-label-disabled, #B6BAC3);
        text-align: right;
        font-feature-settings: 'clig' off, 'liga' off;
  
        /* Button Font/Small */
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 0.875rem */
        letter-spacing: 0.00875rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .tertiary-large {
        display: inline-flex;
        height: 4.8rem;
        padding: 1rem 1.5rem;
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: var(--colour-buttons-surface-fill-surface-tertiary,
            #6981AA);
        color: var(--colour-buttons-text-label-tertiary, #FFF);
        text-align: right;
  
        /* Button Font/Large */
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 1.25rem */
        letter-spacing: 0.0375rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .tertiary-large:hover {
        display: inline-flex;
        height: 4.8rem;
        padding: 1rem 1.5rem;
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%), var(--colour-buttons-surface-fill-surface-tertiary, #6981AA);
        color: var(--colour-buttons-text-label-tertiary, #FFF);
        text-align: right;
  
        /* Button Font/Large */
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 1.25rem */
        letter-spacing: 0.0375rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .tertiary-large-disabled {
        pointer-events: none;
        display: inline-flex;
        height: 4.8rem;
        padding: 1rem 1.5rem;
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: var(--colour-buttons-surface-fill-surface-disabled,
            #D8DBDF);
        color: var(--colour-buttons-text-label-disabled, #B6BAC3);
        text-align: right;
  
        /* Button Font/Large */
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 1.25rem */
        letter-spacing: 0.0375rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .tertiary-medium {
        display: inline-flex;
        height: 3.6rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-lg, 1.25rem);
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: var(--colour-buttons-surface-fill-surface-tertiary,
            #6981AA);
        color: var(--colour-buttons-text-label-tertiary, #FFF);
        text-align: right;
  
        /* Button Font/Medium */
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 600;
        line-height: 120%;
        /* 1.2rem */
        letter-spacing: 0.02rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .tertiary-medium:hover {
        display: inline-flex;
        height: 3.6rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-lg, 1.25rem);
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%), var(--colour-buttons-surface-fill-surface-tertiary, #6981AA);
        color: var(--colour-buttons-text-label-tertiary, #FFF);
        text-align: right;
  
        /* Button Font/Medium */
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 600;
        line-height: 120%;
        /* 1.2rem */
        letter-spacing: 0.02rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .tertiary-medium-disabled {
        pointer-events: none;
        display: inline-flex;
        height: 3.6rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-lg, 1.25rem);
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: var(--colour-buttons-surface-fill-surface-disabled,
            #D8DBDF);
        color: var(--colour-buttons-text-label-disabled, #B6BAC3);
        text-align: right;
  
        /* Button Font/Medium */
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 600;
        line-height: 120%;
        /* 1.2rem */
        letter-spacing: 0.02rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .tertiary-small {
        display: inline-flex;
        height: 3rem;
        padding: var(--spacing-spacing-md, 1rem);
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: var(--colour-buttons-surface-fill-surface-tertiary,
            #6981AA);
        color: var(--colour-buttons-text-label-tertiary, #FFF);
        text-align: right;
        font-feature-settings: 'clig' off, 'liga' off;
  
        /* Button Font/Small */
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 0.875rem */
        letter-spacing: 0.00875rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .tertiary-small:hover {
        display: inline-flex;
        height: 3rem;
        padding: var(--spacing-spacing-md, 1rem);
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%), var(--colour-buttons-surface-fill-surface-tertiary, #6981AA);
        color: var(--colour-buttons-text-label-tertiary, #FFF);
        text-align: right;
        font-feature-settings: 'clig' off, 'liga' off;
  
        /* Button Font/Small */
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 0.875rem */
        letter-spacing: 0.00875rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .tertiary-small-disabled {
        pointer-events: none;
        display: inline-flex;
        height: 3rem;
        padding: var(--spacing-spacing-md, 1rem);
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        background: var(--colour-buttons-surface-fill-surface-disabled,
            #D8DBDF);
        color: var(--colour-buttons-text-label-disabled, #B6BAC3);
        text-align: right;
        font-feature-settings: 'clig' off, 'liga' off;
  
        /* Button Font/Small */
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 0.875rem */
        letter-spacing: 0.00875rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .primary-large-outline {
        display: inline-flex;
        height: 4.8rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-xl, 1.5rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.5rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-brand-coal-coal, #3F5769);
        background: var(--colour-buttons-surface-fill-surface-outline,
            #FFF);
        color: var(--colour-buttons-text-label-secondary, #3F5769);
        text-align: right;
  
        /* Button Font/Large */
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 1.25rem */
        letter-spacing: 0.0375rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .primary-large-outline:hover {
        display: inline-flex;
        height: 4.8rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-xl, 1.5rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.5rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-brand-coal-coal, #3F5769);
        background: var(--colour-brand-slate-slate-50,
            #EEF4FF);
        color: var(--colour-buttons-text-label-secondary, #3F5769);
        text-align: right;
  
        /* Button Font/Large */
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 1.25rem */
        letter-spacing: 0.0375rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .primary-large-outline-disabled {
        pointer-events: none;
        display: inline-flex;
        height: 4.8rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-xl, 1.5rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.5rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-buttons-stroke-stroke-disabled, #B6BAC3);
        color: var(--colour-base-grey-grey-300, #B6BAC3);
        text-align: right;
  
        /* Button Font/Large */
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 1.25rem */
        letter-spacing: 0.0375rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .primary-medium-outline {
        display: inline-flex;
        height: 3.6rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-lg, 1.25rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.5rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-brand-coal-coal, #3F5769);
        background: var(--colour-buttons-surface-fill-surface-outline,
            #FFF);
        color: var(--colour-buttons-text-label-secondary, #3F5769);
        text-align: right;
  
        /* Button Font/Medium */
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 600;
        line-height: 120%;
        /* 1.2rem */
        letter-spacing: 0.02rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .primary-medium-outline:hover {
        display: inline-flex;
        height: 3.6rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-lg, 1.25rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.5rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-brand-coal-coal, #3F5769);
        background: var(--colour-brand-slate-slate-50,
            #EEF4FF);
        color: var(--colour-buttons-text-label-secondary, #3F5769);
        text-align: right;
  
        /* Button Font/Medium */
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 600;
        line-height: 120%;
        /* 1.2rem */
        letter-spacing: 0.02rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .primary-medium-outline-disabled {
        pointer-events: none;
        display: inline-flex;
        height: 3.6rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-lg, 1.25rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.5rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-buttons-stroke-stroke-disabled, #B6BAC3);
        color: var(--colour-base-grey-grey-300, #B6BAC3);
        text-align: right;
  
        /* Button Font/Medium */
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 600;
        line-height: 120%;
        /* 1.2rem */
        letter-spacing: 0.02rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
  
      .primary-small-outline {
        display: inline-flex;
        height: 3rem;
        padding: var(--spacing-spacing-md, 1rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.5rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-brand-coal-coal, #3F5769);
        background: var(--colour-buttons-surface-fill-surface-outline,
            #FFF);
        color: var(--colour-buttons-text-label-secondary, #3F5769);
        text-align: right;
        font-feature-settings: 'clig' off, 'liga' off;
  
        /* Button Font/Small */
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 0.875rem */
        letter-spacing: 0.00875rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .primary-small-outline:hover {
        display: inline-flex;
        height: 3rem;
        padding: var(--spacing-spacing-md, 1rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.5rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-brand-coal-coal, #3F5769);
        background: var(--colour-brand-slate-slate-50,
            #EEF4FF);
        color: var(--colour-buttons-text-label-secondary, #3F5769);
        text-align: right;
        font-feature-settings: 'clig' off, 'liga' off;
  
        /* Button Font/Small */
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 0.875rem */
        letter-spacing: 0.00875rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .primary-small-outline-disabled {
        pointer-events: none;
        display: inline-flex;
        height: 3rem;
        padding: var(--spacing-spacing-md, 1rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-xs, 0.5rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-buttons-stroke-stroke-disabled, #B6BAC3);
        color: var(--colour-base-grey-grey-300, #B6BAC3);
        text-align: right;
        font-feature-settings: 'clig' off, 'liga' off;
  
        /* Button Font/Small */
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 0.875rem */
        letter-spacing: 0.00875rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
  
      .secondary-large-outline {
        display: inline-flex;
        height: 4.8rem;
        padding: 1rem 1.5rem;
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--sunglow500);
        background: var(--colour-buttons-surface-fill-surface-outline,
            #FFF);
        color: var(--colour-buttons-text-label-secondary, #3F5769);
        text-align: right;
  
        /* Button Font/Large */
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 1.25rem */
        letter-spacing: 0.0375rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .secondary-large-outline:hover {
        display: inline-flex;
        height: 4.8rem;
        padding: 1rem 1.5rem;
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--sunglow500);
        background: var(--colour-brand-sunglow-sunglow-50,
            #FFF5DB);
        color: var(--colour-buttons-text-label-secondary, #3F5769);
        text-align: right;
  
        /* Button Font/Large */
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 1.25rem */
        letter-spacing: 0.0375rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .secondary-large-outline-disabled {
        pointer-events: none;
        display: inline-flex;
        height: 4.8rem;
        padding: 1rem 1.5rem;
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-buttons-stroke-stroke-disabled, #B6BAC3);
        background: var(--colour-buttons-surface-fill-surface-outline,
            #FFF);
        color: var(--colour-buttons-stroke-stroke-disabled, #B6BAC3);
        text-align: right;
  
        /* Button Font/Large */
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 1.25rem */
        letter-spacing: 0.0375rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .secondary-medium-outline {
        display: inline-flex;
        height: 3.6rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-lg, 1.25rem);
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--sunglow500);
        background: var(--colour-buttons-surface-fill-surface-outline,
            #FFF);
        color: var(--colour-buttons-text-label-secondary, #3F5769);
        text-align: right;
  
        /* Button Font/Medium */
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 600;
        line-height: 120%;
        /* 1.2rem */
        letter-spacing: 0.02rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .secondary-medium-outline:hover {
        display: inline-flex;
        height: 3.6rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-lg, 1.25rem);
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--sunglow500);
        background: var(--colour-brand-sunglow-sunglow-50,
            #FFF5DB);
        color: var(--colour-buttons-text-label-secondary, #3F5769);
        text-align: right;
  
        /* Button Font/Medium */
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 600;
        line-height: 120%;
        /* 1.2rem */
        letter-spacing: 0.02rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .secondary-medium-outline-disabled {
        pointer-events: none;
        display: inline-flex;
        height: 3.6rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-lg, 1.25rem);
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-buttons-stroke-stroke-disabled, #B6BAC3);
        background: var(--colour-buttons-surface-fill-surface-outline,
            #FFF);
        color: var(--colour-buttons-stroke-stroke-disabled, #B6BAC3);
        text-align: right;
  
        /* Button Font/Medium */
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 600;
        line-height: 120%;
        /* 1.2rem */
        letter-spacing: 0.02rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .secondary-small-outline {
        display: inline-flex;
        height: 3rem;
        padding: var(--spacing-spacing-md, 1rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-none, 0rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--sunglow500);
        background: var(--colour-buttons-surface-fill-surface-outline,
            #FFF);
        color: var(--colour-buttons-text-label-secondary, #3F5769);
        text-align: right;
        font-feature-settings: 'clig' off, 'liga' off;
  
        /* Button Font/Small */
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 0.875rem */
        letter-spacing: 0.00875rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .secondary-small-outline:hover {
        display: inline-flex;
        height: 3rem;
        padding: var(--spacing-spacing-md, 1rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-none, 0rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--sunglow500);
        background: var(--colour-brand-sunglow-sunglow-50,
            #FFF5DB);
        color: var(--colour-buttons-text-label-secondary, #3F5769);
        text-align: right;
        font-feature-settings: 'clig' off, 'liga' off;
  
        /* Button Font/Small */
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 0.875rem */
        letter-spacing: 0.00875rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .secondary-small-outline-disabled {
        pointer-events: none;
        display: inline-flex;
        height: 3rem;
        padding: var(--spacing-spacing-md, 1rem);
        justify-content: center;
        align-items: center;
        gap: var(--spacing-spacing-none, 0rem);
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-buttons-stroke-stroke-disabled, #B6BAC3);
        background: var(--colour-buttons-surface-fill-surface-outline,
            #FFF);
        color: var(--colour-buttons-stroke-stroke-disabled, #B6BAC3);
        text-align: right;
        font-feature-settings: 'clig' off, 'liga' off;
  
        /* Button Font/Small */
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 0.875rem */
        letter-spacing: 0.00875rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .tertiary-large-outline {
        display: inline-flex;
        height: 4.8rem;
        padding: 1rem 1.5rem;
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-buttons-stroke-stroke-label-tertiary-outline, #6981AA);
        background: var(--colour-buttons-surface-fill-surface-outline,
            #FFF);
        color: var(--colour-buttons-stroke-stroke-label-tertiary-outline, #6981AA);
        text-align: right;
  
        /* Button Font/Large */
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 1.25rem */
        letter-spacing: 0.0375rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .tertiary-large-outline:hover {
        display: inline-flex;
        height: 4.8rem;
        padding: 1rem 1.5rem;
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-buttons-stroke-stroke-label-tertiary-outline, #6981AA);
        background: var(--colour-brand-slate-slate-50,
            #EEF4FF);
        color: var(--colour-buttons-stroke-stroke-label-tertiary-outline, #6981AA);
        text-align: right;
  
        /* Button Font/Large */
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 1.25rem */
        letter-spacing: 0.0375rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .tertiary-large-outline-disabled {
        pointer-events: none;
        display: inline-flex;
        height: 4.8rem;
        padding: 1rem 1.5rem;
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-buttons-stroke-stroke-disabled, #B6BAC3);
        background: var(--colour-buttons-surface-fill-surface-outline,
            #FFF);
        color: var(--colour-buttons-stroke-stroke-disabled, #B6BAC3);
        text-align: right;
  
        /* Button Font/Large */
        font-family: 'Source Sans 3';
        font-size: 2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 1.25rem */
        letter-spacing: 0.0375rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .tertiary-medium-outline {
        display: inline-flex;
        height: 3.6rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-lg, 1.25rem);
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-buttons-stroke-stroke-label-tertiary-outline, #6981AA);
        background: var(--colour-buttons-surface-fill-surface-outline,
            #FFF);
        color: var(--colour-buttons-stroke-stroke-label-tertiary-outline, #6981AA);
        text-align: right;
  
        /* Button Font/Medium */
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 600;
        line-height: 120%;
        /* 1.2rem */
        letter-spacing: 0.02rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .tertiary-medium-outline:hover {
        display: inline-flex;
        height: 3.6rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-lg, 1.25rem);
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-buttons-stroke-stroke-label-tertiary-outline, #6981AA);
        background: var(--colour-brand-slate-slate-50,
            #EEF4FF);
        color: var(--colour-buttons-stroke-stroke-label-tertiary-outline, #6981AA);
        text-align: right;
  
        /* Button Font/Medium */
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 600;
        line-height: 120%;
        /* 1.2rem */
        letter-spacing: 0.02rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .tertiary-medium-outline-disabled {
        pointer-events: none;
        display: inline-flex;
        height: 3.6rem;
        padding: var(--spacing-spacing-md, 1rem) var(--spacing-spacing-lg, 1.25rem);
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-buttons-stroke-stroke-disabled, #B6BAC3);
        background: var(--colour-buttons-surface-fill-surface-outline,
            #FFF);
        color: var(--colour-buttons-stroke-stroke-disabled, #B6BAC3);
        text-align: right;
  
        /* Button Font/Medium */
        font-family: 'Source Sans 3';
        font-size: 1.6rem;
        font-style: normal;
        font-weight: 600;
        line-height: 120%;
        /* 1.2rem */
        letter-spacing: 0.02rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .tertiary-small-outline {
        display: inline-flex;
        height: 3rem;
        padding: var(--spacing-spacing-md, 1rem);
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-buttons-stroke-stroke-label-tertiary-outline, #6981AA);
        background: var(--colour-buttons-surface-fill-surface-outline,
            #FFF);
        color: var(--colour-buttons-stroke-stroke-label-tertiary-outline, #6981AA);
        text-align: right;
        font-feature-settings: 'clig' off, 'liga' off;
  
        /* Button Font/Small */
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 0.875rem */
        letter-spacing: 0.00875rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .tertiary-small-outline:hover {
        display: inline-flex;
        height: 3rem;
        padding: var(--spacing-spacing-md, 1rem);
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-buttons-stroke-stroke-label-tertiary-outline, #6981AA);
        background: var(--colour-brand-slate-slate-50,
            #EEF4FF);
        color: var(--colour-buttons-stroke-stroke-label-tertiary-outline, #6981AA);
        text-align: right;
        font-feature-settings: 'clig' off, 'liga' off;
  
        /* Button Font/Small */
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 0.875rem */
        letter-spacing: 0.00875rem;
        text-transform: uppercase;
        cursor: pointer;
      }
  
      .tertiary-small-outline-disabled {
        pointer-events: none;
        display: inline-flex;
        height: 3rem;
        padding: var(--spacing-spacing-md, 1rem);
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        border-radius: 2.8125rem;
        border: 2px solid var(--colour-buttons-stroke-stroke-disabled, #B6BAC3);
        background: var(--colour-buttons-surface-fill-surface-outline,
            #FFF);
        color: var(--colour-buttons-stroke-stroke-disabled, #B6BAC3);
        text-align: right;
        font-feature-settings: 'clig' off, 'liga' off;
  
        /* Button Font/Small */
        font-family: 'Source Sans 3';
        font-size: 1.2rem;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        /* 0.875rem */
        letter-spacing: 0.00875rem;
        text-transform: uppercase;
        cursor: pointer;
      }

      .primary-large-icon {}

      .primary-large-icon:hover {}
  
      .primary-large-icon-disabled {
        pointer-events: none;
      }
  
      .primary-medium-icon {}
  
      .primary-medium-icon:hover {}
  
      .primary-medium-icon-disabled {
        pointer-events: none;
      }
  
  
      .primary-small-icon {}
  
      .primary-small-icon:hover {}
  
      .primary-small-icon-disabled {
        pointer-events: none;
      }
  
  
      .secondary-large-icon {}
  
      .secondary-large-icon:hover {}
  
      .secondary-large-icon-disabled {
        pointer-events: none;
      }
  
      .secondary-medium-icon {}
  
      .secondary-medium-icon:hover {}
  
      .secondary-medium-icon-disabled {
        pointer-events: none;
      }
  
      .secondary-small-icon {}
  
      .secondary-small-icon:hover {}
  
      .secondary-small-icon-disabled {
        pointer-events: none;
      }
  
      .tertiary-large-icon {}
  
      .tertiary-large-icon:hover {}
  
      .tertiary-large-icon-disabled {
        pointer-events: none;
      }
  
      .tertiary-medium-icon {}
  
      .tertiary-medium-icon:hover {}
  
      .tertiary-medium-icon-disabled {
        pointer-events: none;
      }
  
      .tertiary-small-icon {}
  
      .tertiary-small-icon:hover {}
  
      .tertiary-small-icon-disabled {
        pointer-events: none;
      }
  
  
    
    