@charset "UTF-8";

@font-face {
    font-display: swap;
    font-family: Plus Jakarta Sans;
    font-style: normal;
    font-weight: 400 700;
    src: url("https://causeway.com/hubfs/Causeway theme (2024)/Fonts/PlusJakartaSans-VariableFont_wght.ttf") format("truetype-variations")
}

@font-face {
    font-display: swap;
    font-family: Plus Jakarta Sans;
    font-style: italic;
    font-weight: 400 700;
    src: url("https://causeway.com/hubfs/Causeway theme (2024)/Fonts/PlusJakartaSans-Italic-VariableFont_wght.ttf") format("truetype-variations")
}

@font-face {
    font-display: swap;
    font-family: Instrument Sans;
    font-style: normal;
    font-weight: 400 700;
    src: url("https://causeway.com/hubfs/Causeway theme (2024)/Fonts/InstrumentSans-VariableFont_wdth%2cwght.ttf") format("truetype-variations")
}

@font-face {
    font-display: swap;
    font-family: Instrument Sans;
    font-style: italic;
    font-weight: 400 700;
    src: url("https://causeway.com/hubfs/Causeway theme (2024)/Fonts/InstrumentSans-Italic-VariableFont_wdth%2cwght.ttf") format("truetype-variations")
}

:root {
    --wrapper: 1728px;
    --margin: 1rem;
    --vertical-spacing: 2.5rem;
    --s-spacing: 1rem;
    --m-spacing: 1.2rem;
    --l-spacing: 1.6rem;
    --xl-spacing: 2.2rem;
    --flow: 1.5em;
    --secondary-nav-height: 32px;
    --nav-logo-height: 24px;
    --divider-height: 4px;
    --nav-height: 66px;
    --combined-nav-height: calc(var(--secondary-nav-height) + var(--divider-height) + var(--nav-height));
    --colour-blue: #3fa7d9;
    --colour-green: #03cf9e;
    --colour-lavender: #957dff;
    --colour-lavender-mid: #7d7099;
    --colour-orange: #f87a63;
    --colour-pink: #b86bb2;
    --colour-purple: #301b5d;
    --colour-purple-dark: #301b5d;
    --colour-purple-dark-25: rgba(48, 27, 93, .25);
    --colour-green-light: #dbfef6;
    --colour-lavender-light: #f2efff;
    --colour-orange-light: #feebe8;
    --colour-lilac-light: #f1e1f0;
    --colour-blue-light: #d9edf7;
    --colour-violet-light: #eae5ff;
    --colour-indigo-light: #eae7ef;
    --colour-purple-light: #e7ccf2;
    --colour-gradient-line: linear-gradient(90deg, var(--colour-orange) 0%, var(--colour-lavender) 100%);
    --team-card-gradient: linear-gradient(180deg, rgba(18, 7, 40, 0), #120728);
    --colour-white: #fff;
    --colour-black: #120728;
    --colour-grey: #999;
    --colour-grey-light: #c3c3c3;
    --colour-background: var(--colour-white);
    --colour-heading: #200d3f;
    --colour-paragraph: #434049;
    --colour-error: #eb0000;
    --colour-link: #6542ff;
    --colour-menu-link: var(--colour-purple-dark);
    --divider-colour-orange: var(--colour-orange);
    --divider-colour-lavender: var(--colour-lavender);
    --font-family-body: "Instrument Sans", sans-serif;
    --font-family-heading: "Plus Jakarta Sans", sans-serif;
    --font-family-link: "Plus Jakarta Sans", sans-serif;
    --font-weight-regular: 400;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-size-base: 1rem;
    --font-size-s: 14px;
    --font-size-xs: 12px;
    --font-size-xl: 2.1rem;
    --font-size-xxl: 2.4rem;
    --font-size-p: var(--font-size-base);
    --font-size-h6: 1.1rem;
    --font-size-h5: 1.2rem;
    --font-size-h4: 1.3rem;
    --font-size-h3: 1.4rem;
    --font-size-h2: 1.5rem;
    --font-size-h1: 1.9rem;
    --line-height-body: 172%;
    --line-height-h6: 148%;
    --line-height-h5: 140%;
    --line-height-h4: 132%;
    --line-height-h3: 128%;
    --line-height-h2: 116%;
    --line-height-h1: 110%;
    --line-height-s: 160%;
    --line-height-xs: 140%;
    --line-height-xl: 108%;
    --line-height-xxl: 104%;
    --button-colour: var(--colour-purple-dark);
    --border-radius: 12px;
    --box-shadow: 0 0 6px -3px rgba(0, 0, 0, .5);
    --arrow-icon: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='12' fill='none' viewBox='0 0 13 12'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M1 6.275h10.686m0 0L7.5 1.775m4.186 4.5-4.186 4.5'/%3E%3C/svg%3E");
    --chevron-icon: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='8' fill='none' viewBox='0 0 13 8'%3E%3Cpath stroke='%23171535' stroke-width='2' d='M12 6.705 6.726 1.431 1.45 6.705'/%3E%3C/svg%3E");
    --chevron-icon-green: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='8' fill='none' viewBox='0 0 13 8'%3E%3Cpath stroke='%2306efb5' stroke-width='2' d='M12 6.705 6.726 1.431 1.45 6.705'/%3E%3C/svg%3E");
    --chevron-select-icon: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='8' fill='none' viewBox='0 0 13 8'%3E%3Cpath stroke='%23fff' stroke-width='2' d='M12 1.43 6.726 6.706 1.45 1.431'/%3E%3C/svg%3E");
    --chevron-icon-white: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='8' fill='none' viewBox='0 0 13 8'%3E%3Cpath stroke='%23FFF' stroke-width='2' d='M12 6.705 6.726 1.431 1.45 6.705'/%3E%3C/svg%3E");
    --play-btn-svg: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='28' fill='none' viewBox='0 0 24 28'%3E%3Cpath stroke='%23301B5D' stroke-width='3.5' d='M21.48 13.132a1 1 0 0 1 0 1.736L3.497 25.145A1 1 0 0 1 2 24.277V3.723a1 1 0 0 1 1.496-.868z'/%3E%3C/svg%3E");
    --accordion-btn: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='41' height='41' fill='none' viewBox='0 0 41 41'%3E%3Ccircle cx='20.49' cy='20.133' r='19' fill='%23301B5D' stroke='%23301B5D' stroke-width='2' transform='rotate(90 20.49 20.133)'/%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m26.782 18.206-6.29 5.852-6.291-5.852'/%3E%3C/svg%3E");
    --check-mark: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='11' fill='none' viewBox='0 0 14 11'%3E%3Cpath stroke='%23301B5D' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m1 6.002 3.5 3.5 8.5-8.5'/%3E%3C/svg%3E");
    --check-mark-white: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='11' fill='none' viewBox='0 0 14 11'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m1 6.002 3.5 3.5 8.5-8.5'/%3E%3C/svg%3E");
    --icon-arrow: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='12' fill='none' viewBox='0 0 13 12'%3E%3Cpath stroke='%23301B5D' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M1 6.043h10.686m0 0L7.5 1.543m4.186 4.5-4.186 4.5'/%3E%3C/svg%3E");
    --icon-search: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='21' fill='none' viewBox='0 0 21 21'%3E%3Cpath fill='%23000' d='m20.058 19.49-5.53-5.53a8.07 8.07 0 1 0-1.036 1.035l5.53 5.531zM1.748 8.809A6.592 6.592 0 1 1 8.34 15.4a6.6 6.6 0 0 1-6.59-6.592'/%3E%3C/svg%3E");
    --icon-select-arrows: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='21' fill='none' viewBox='0 0 12 21'%3E%3Cpath fill='%23171535' d='m6.084 20.65-5.417-7.5H11.5zm-.002-20 5.417 7.5H.666z'/%3E%3C/svg%3E");
    --icon-article-arrow: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 20 20'%3E%3Ccircle cx='10.162' cy='10.15' r='9.828' fill='%230FFBC0'/%3E%3Cpath stroke='%23301B5D' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5.83 10.15h8.664m0 0L11.1 6.501m3.394 3.65L11.1 13.798'/%3E%3C/svg%3E");
    --icon-arrow-white: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='12' fill='none' viewBox='0 0 13 12'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M1 6.043h10.686m0 0L7.5 1.543m4.186 4.5-4.186 4.5'/%3E%3C/svg%3E");
    --team-background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='540' height='557' fill='none' viewBox='0 0 540 557'%3E%3Cpath fill='url(%23a)' fill-opacity='.2' fill-rule='evenodd' d='M2.011 15.534c-4.28-14.19-.578-34.41 8.475-45.245l.194.207 229.747-274.695 101.432 325.91c4.282 14.191.579 34.411-8.475 45.246L103.637 341.652zm424.755 92.453 373.513 153.057-.196-.019-237.395 283.966c-8.853 10.665-27.836 14.884-42.11 8.984L147.065 400.919l237.591-283.947c9.05-10.647 27.836-14.885 42.11-8.985m376.928 83.523-.068-.217.071.029zm-.068-.217-361.32-147.9c-14.275-5.9-29.354-22.07-33.832-36.28L307.042-318.798l25.813 10.594 335.578 137.336c14.275 5.9 29.354 22.07 33.832 36.279z' clip-rule='evenodd'/%3E%3Cdefs%3E%3ClinearGradient id='a' x1='535.101' x2='37.73' y1='60.472' y2='3.829' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23813583'/%3E%3Cstop offset='1' stop-color='%23AFA3DC' stop-opacity='0'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E");
    --toast-close: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIHdpZHRoPSI1MTIiIGhlaWdodD0iNTEyIiB2aWV3Qm94PSIwIDAgNTEyIDUxMiI+PHBhdGggZmlsbD0iI2ZmZiIgZD0ibTMyNS42IDI1NiAxNzItMTcyYzE5LjMtMTkuMiAxOS4zLTUwLjMuMi02OS42LTE5LjItMTkuMy01MC4zLTE5LjMtNjkuNi0uMmwtLjEuMS0xNzIgMTcyTDg0IDE0LjRjLTE5LjItMTkuMi01MC40LTE5LjItNjkuNiAwcy0xOS4yIDUwLjQgMCA2OS42bDE3MiAxNzItMTcyIDE3MmMtMTkuMiAxOS4yLTE5LjIgNTAuNCAwIDY5LjZzNTAuNCAxOS4yIDY5LjYgMGwxNzItMTcyIDE3MiAxNzJjMTkuMiAxOS4yIDUwLjQgMTkuMiA2OS42IDBzMTkuMi01MC40IDAtNjkuNnoiIGRhdGEtb3JpZ2luYWw9IiMwMDAwMDAiLz48L3N2Zz4=);
    --star-icon: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='20' fill='none' viewBox='0 0 21 20'%3E%3Cpath fill='%23fff' d='M10.185.057 7.055 6.4.057 7.41l5.063 4.94-1.197 6.969 6.26-3.289 6.261 3.289-1.197-6.97 5.064-4.932L13.315 6.4z'/%3E%3C/svg%3E");
    --star-icon-dark: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='20' fill='none' viewBox='0 0 21 20'%3E%3Cpath fill='%23301b5d' d='M10.185.057 7.055 6.4.057 7.41l5.063 4.94-1.197 6.969 6.26-3.289 6.261 3.289-1.197-6.97 5.064-4.932L13.315 6.4z'/%3E%3C/svg%3E");
    --tooltip-i: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='11' fill='none' viewBox='0 0 6 11'%3E%3Cpath fill='%23fff' d='M.735 9.183 2.51 4.587l.403.475a2.8 2.8 0 0 0-.741.071q-.35.085-.709.293a6 6 0 0 0-.773.565l-.319-.37a8 8 0 0 1 1.196-1.073q.56-.396 1.053-.559.5-.162.956-.162.662 0 .845.26.18.26-.033.819L2.614 9.573l-.43-.566q.404.026.755-.045.35-.072.695-.254a4.6 4.6 0 0 0 .728-.48l.3.39a7.5 7.5 0 0 1-1.151.961q-.546.358-1.053.514a3.2 3.2 0 0 1-.982.162q-.604 0-.793-.24-.188-.24.052-.832m2.295-7.43q0-.318.143-.565a1 1 0 0 1 .435-.384q.293-.143.728-.143.56 0 .871.26a.84.84 0 0 1 .312.69q0 .318-.143.565a1 1 0 0 1-.435.39q-.287.136-.728.136-.56 0-.871-.26a.85.85 0 0 1-.312-.689'/%3E%3C/svg%3E");
    --check-mark-dark: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='12' fill='none' viewBox='0 0 15 12'%3E%3Cpath stroke='%231D0843' stroke-width='3' d='m1.162 5.598 3.89 3.89 8.061-8.061'/%3E%3C/svg%3E");
    --cross-white: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' fill='none' viewBox='0 0 13 13'%3E%3Cpath stroke='%23fff' stroke-width='3' d='m1.371 11.814 9.808-9.808m0 9.808L1.371 2.006'/%3E%3C/svg%3E");
    --cross-dark: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' fill='none' viewBox='0 0 13 13'%3E%3Cpath stroke='%231D0843' stroke-width='3' d='m1.371 11.814 9.808-9.808m0 9.808L1.371 2.006'/%3E%3C/svg%3E");
    --chevron-dark: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='9' fill='none' viewBox='0 0 13 9'%3E%3Cpath stroke='%231D0843' stroke-width='3' d='m1.167 1.485 5.019 5.02 5.019-5.02'/%3E%3C/svg%3E")
}

*,
:after,
:before {
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

ol[class],
ul[class] {
    padding: 0
}

blockquote,
body,
dd,
dl,
figcaption,
figure,
h1,
h2,
h3,
h4,
h5,
h6,
li,
ol,
p,
ul {
    margin: 0
}

html {
    -webkit-text-size-adjust: 100%;
    font-family: var(--font-family-body);
    font-size: var(--font-size-base);
    scroll-behavior: smooth
}

body {
    background-color: var(--colour-background);
    color: var(--colour-paragraph);
    line-height: var(--line-height-body);
    min-height: 100vh
}

body.overlay #main-content:after {
    opacity: .5;
    transition: opacity .32s ease .2s
}

img {
    display: block;
    max-width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

table,
table td {
    border: 1px solid #444
}

table td {
    word-wrap: break-word
}

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: inherit;
    margin: 0
}

button,
input {
    overflow: visible
}

button,
select {
    text-transform: none
}

[type=button],
[type=reset],
[type=submit],
button {
    -webkit-appearance: button;
    -moz-appearance: button;
    appearance: button
}

.row-fluid [class*=span] {
    min-height: 0
}

.hs-cta-img {
    height: auto;
    width: auto
}

[data-hs-anchor=true] {
    margin: 0
}

.anchor-div {
    scroll-margin-top: calc(var(--nav-height) + var(--divider-height))
}

.module {
    overflow: hidden;
    position: relative;
    z-index: 1
}

body[data-hs-dragdrop=true] .header-dnd .module .wrapper {
    padding-top: 0
}

body[data-hs-dragdrop=true] .Nav {
    position: relative
}

body[data-hs-dragdrop=true] main#main-content {
    overflow: hidden;
    padding: 8px 0 0
}

.Hidden-module {
    color: #fff;
    font-weight: 400;
    margin: 2rem 0;
    width: 100%
}

.Editor--message,
.Hidden-module {
    background: var(--colour-purple-dark);
    padding: 1rem;
    text-align: center
}

.Editor--message {
    color: var(--colour-white);
    display: flex;
    flex-wrap: wrap;
    font-size: 16px;
    gap: 2rem;
    justify-content: center
}

.Editor--message span {
    background: var(--colour-lavender-light);
    color: var(--colour-purple-dark);
    font-weight: var(--font-weight-bold);
    padding: 2px 8px
}

div#hubspot-messages-iframe-container {
    z-index: 10000 !important
}

.grid {
    display: grid;
    grid-gap: var(--xl-spacing);
    gap: var(--xl-spacing)
}

.grid--medium-gap {
    gap: var(--m-spacing)
}

.hs_cos_wrapper_type_rich_text>*+* {
    margin: var(--flow) 0
}

.flow>*+* {
    margin: var(--flow) 0 0
}

.flow--s>*+* {
    margin: calc(var(--flow)*.5) 0 0
}

.flow--l>*+* {
    margin: calc(var(--flow)*1.5) 0 0
}

.flow--xl>*+* {
    margin: calc(var(--flow)*1.7) 0 0
}

.flow--extra-large-title h1,
.flow--extra-large-title h2,
.h1-xl {
    font-size: var(--font-size-xl) !important;
    line-height: var(--line-height-xl) !important
}

.h1,
.h1-xl,
h1 {
    color: var(--colour-heading);
    font-family: var(--font-family-heading);
    font-weight: var(--font-weight-semibold);
    opacity: 1
}

.h1,
h1 {
    font-size: var(--font-size-h1);
    line-height: var(--line-height-h1)
}

.h1 b,
.h1 strong,
.h2,
h1 b,
h1 strong,
h2 {
    font-weight: var(--font-weight-semibold)
}

.h2,
h2 {
    color: var(--colour-heading);
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h2);
    line-height: var(--line-height-h2);
    opacity: 1
}

.h2 b,
.h2 strong,
.h3,
h2 b,
h2 strong,
h3 {
    font-weight: var(--font-weight-semibold)
}

.h3,
h3 {
    color: var(--colour-heading);
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h3);
    line-height: var(--line-height-h3);
    opacity: 1
}

.h3 b,
.h3 strong,
.h4,
h3 b,
h3 strong,
h4 {
    font-weight: var(--font-weight-semibold)
}

.h4,
h4 {
    color: var(--colour-heading);
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h4);
    line-height: var(--line-height-h4);
    opacity: 1
}

.h4 b,
.h4 strong,
.h5,
h4 b,
h4 strong,
h5 {
    font-weight: var(--font-weight-semibold)
}

.h5,
h5 {
    color: var(--colour-heading);
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h5);
    line-height: var(--line-height-h5);
    opacity: 1
}

.h5 b,
.h5 strong,
.h6,
h5 b,
h5 strong,
h6 {
    font-weight: var(--font-weight-semibold)
}

.h6,
h6 {
    color: var(--colour-heading);
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h6);
    line-height: var(--line-height-h6);
    opacity: 1
}

.h6 b,
.h6 strong,
h6 b,
h6 strong {
    font-weight: var(--font-weight-semibold)
}

p {
    font-size: var(--font-size-p)
}

a {
    color: var(--colour-link);
    font-family: var(--font-family-link);
    font-weight: var(--font-weight-bold);
    -webkit-text-decoration: none;
    text-decoration: none;
    transition: color .2s ease, opacity .1s ease
}

.small-subtitle {
    font-size: var(--font-size-s);
    font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-bold);
    letter-spacing: 2px
}

.small-subtitle,
.tab-text {
    color: var(--colour-heading);
    font-family: var(--font-family-heading);
    opacity: 1
}

.tab-text {
    font-size: var(--font-size-p)
}

.tab-text,
.tag-text {
    font-weight: var(--font-weight-semibold)
}

.tag-text {
    color: var(--colour-heading);
    font-size: var(--font-size-base);
    line-height: 1.2
}

blockquote {
    background: var(--colour-lavender-light);
    border-radius: var(--border-radius);
    padding: var(--l-spacing)
}

blockquote>*+* {
    margin: var(--flow) 0 0
}

blockquote p:first-of-type {
    color: var(--colour-heading);
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h4);
    line-height: 140%;
    opacity: 1
}

blockquote p:first-of-type,
blockquote p:last-of-type {
    font-weight: var(--font-weight-semibold)
}

blockquote.bg-colour-dark * {
    color: var(--colour-white) !important
}

code,
pre {
    background: #272a35;
    border-radius: var(--border-radius);
    color: #c9cdd3;
    display: block;
    font-family: SF Mono, Menlo, Monaco, Courier New, Courier, monospace;
    font-size: var(--font-size-p);
    letter-spacing: .01em;
    padding: var(--l-spacing);
    white-space: pre-wrap;
    word-wrap: break-word
}

ul li:first-child {
    padding-top: 0
}

ul li {
    padding-top: .5rem
}

.bg-colour-default {
    --module-background-colour: var(--colour-white)
}

.bg-colour-light_orange {
    --module-background-colour: var(--colour-orange-light)
}

.bg-colour-light_green {
    --module-background-colour: var(--colour-green-light)
}

.bg-colour-light_lavender {
    --module-background-colour: var(--colour-lavender-light)
}

.bg-colour-light_lilac {
    --module-background-colour: var(--colour-lilac-light)
}

.bg-colour-light_blue {
    --module-background-colour: var(--colour-blue-light)
}

.bg-colour-light_violet {
    --module-background-colour: var(--colour-violet-light)
}

.bg-colour-light_indigo {
    --module-background-colour: var(--colour-indigo-light)
}

.bg-colour-light_purple {
    --module-background-colour: var(--colour-purple-light)
}

.bg-colour-orange_white {
    --module-background-gradient: linear-gradient(180deg, var(--colour-orange-light) 0%, var(--colour-background) 100%)
}

.bg-colour-green_white {
    --module-background-gradient: linear-gradient(180deg, var(--colour-green-light) 0%, var(--colour-background) 100%)
}

.bg-colour-lavender_white {
    --module-background-gradient: linear-gradient(180deg, var(--colour-lavender-light) 0%, var(--colour-background) 100%)
}

.bg-colour-dark,
.bg-colour-purple-2 {
    --module-background-colour: var(--colour-black);
    --colour-link: var(--colour-lavender)
}

.bg-colour-dark .Accordion__container,
.bg-colour-dark .FormComponent,
.bg-colour-dark .TwoColumnBanner__step-icon,
.bg-colour-dark blockquote,
.bg-colour-dark form,
.bg-colour-purple-2 .Accordion__container,
.bg-colour-purple-2 .FormComponent,
.bg-colour-purple-2 .TwoColumnBanner__step-icon,
.bg-colour-purple-2 blockquote,
.bg-colour-purple-2 form {
    --colour-link: #6542ff
}

.bg-colour-dark :not(a):not(button):not(form):not(blockquote *):not(.Accordion__container *):not(.FormComponent *):not(.TwoColumnBanner__step-icon):not(.CardComponent--contained *):not(.CaseStudyTabItem--bottom *):not(.ScrollCard *):not(.HeroFeatureTabsItem *):not(.ImageHotspotArea *),
.bg-colour-purple-2 :not(a):not(button):not(form):not(blockquote *):not(.Accordion__container *):not(.FormComponent *):not(.TwoColumnBanner__step-icon):not(.CardComponent--contained *):not(.CaseStudyTabItem--bottom *):not(.ScrollCard *):not(.HeroFeatureTabsItem *):not(.ImageHotspotArea *) {
    color: var(--colour-white)
}

.bg-colour-purple-2 {
    --module-background-colour: var(--colour-purple-dark)
}

.bg-colour-purple {
    --element-background-colour: var(--colour-purple-dark)
}

.bg-colour-black {
    --element-background-colour: var(--colour-black)
}

.bg-position-full_height {
    background: var(--module-background-gradient, var(--module-background-colour))
}

.bg-position-top {
    background-image: linear-gradient(to bottom, var(--module-background-colour) var(--bg_position_value), transparent var(--bg_position_value))
}

.bg-position-bottom {
    background-image: linear-gradient(to top, var(--module-background-colour) var(--bg_position_value), transparent var(--bg_position_value))
}

.bg-decor-shape-wrapper {
    align-items: flex-end;
    bottom: 50%;
    display: flex;
    height: 100%;
    justify-content: flex-end;
    position: absolute;
    right: 0;
    transform: translateY(50%);
    z-index: -1
}

.bg-decor-shape-wrapper svg {
    height: 100%;
    overflow: visible;
    width: auto
}

.bg-decor-shape-wrapper--hero,
.bg-decor-shape-wrapper--hero-podcasts {
    bottom: 0;
    height: calc(100% + var(--nav-height) + 20px);
    transform: none
}

.bg-decor-shape-wrapper--hero-podcasts svg {
    opacity: .75
}

.bg-decor-shape-wrapper--hero-podcasts-dark svg {
    opacity: .25
}

.bg-decor-shape-wrapper--hero-tabs-1,
.bg-decor-shape-wrapper--hero-tabs-2 {
    bottom: auto;
    height: 40%;
    max-height: 35vw;
    top: 20%;
    transform: none
}

.bg-decor-shape-wrapper--hero-tabs-1 svg,
.bg-decor-shape-wrapper--hero-tabs-2 svg {
    opacity: .5
}

.bg-decor-shape-wrapper--hero-tabs-2 {
    height: 30%;
    top: 30%;
    transform: rotate(-70deg)
}

.bg-decor-shape-wrapper--form-module {
    bottom: auto;
    height: 70%;
    max-height: 35vw;
    top: 12%;
    transform: none
}

.bg-decor-shape-wrapper--form-module svg {
    opacity: .5
}

.bg-decor-shape-wrapper--single-col-form-module {
    bottom: auto;
    height: 45%;
    top: 10%;
    transform: none
}

.bg-decor-shape-wrapper--single-col-form-module svg {
    opacity: .5
}

.bg-decor-shape-wrapper--single-col-form-module.bg-decor-shape-wrapper--mirror.bg-decor-shape-wrapper {
    bottom: 15%;
    height: 40%;
    top: auto
}

.bg-decor-shape-wrapper--subscription-form {
    bottom: 15%;
    transform: translateY(50%) rotate(170deg)
}

.bg-decor-shape-wrapper--mirror,
.bg-decor-shape-wrapper--subscription-form {
    justify-content: flex-start;
    left: 0;
    right: auto
}

.bg-decor-shape-wrapper--mirror svg {
    transform: scaleX(-1)
}

.element-accent-colour-orange,
.element-bg-colour-orange,
.module-accent-colour-orange {
    --module-accent-colour: var(--colour-orange);
    --module-accent-colour-light: var(--colour-orange-light);
    --element-accent-colour: var(--colour-orange);
    --element-accent-colour-light: var(--colour-orange-light);
    --element-bg-colour: var(--colour-orange);
    --element-bg-colour-light: var(--colour-orange-light)
}

.element-accent-colour-green,
.element-bg-colour-green,
.module-accent-colour-green {
    --module-accent-colour: var(--colour-green);
    --module-accent-colour-light: var(--colour-green-light);
    --element-accent-colour: var(--colour-green);
    --element-accent-colour-light: var(--colour-green-light);
    --element-bg-colour: var(--colour-green);
    --element-bg-colour-light: var(--colour-green-light)
}

.element-accent-colour-lavender,
.element-bg-colour-lavender,
.module-accent-colour-lavender {
    --module-accent-colour: var(--colour-lavender);
    --module-accent-colour-light: var(--colour-lavender-light);
    --element-accent-colour: var(--colour-lavender);
    --element-accent-colour-light: var(--colour-lavender-light);
    --element-bg-colour: var(--colour-lavender);
    --element-bg-colour-light: var(--colour-lavender-light)
}

.image-round-corners {
    border-radius: var(--border-radius)
}

.image-cover,
.image-round-corners {
    -o-object-fit: cover;
    object-fit: cover
}

.image-cover {
    height: 100%;
    -o-object-position: center;
    object-position: center;
    width: 100%
}

.Bullet {
    background: var(--colour-purple-dark);
    border-radius: 50%;
    cursor: pointer;
    height: 14px;
    transition: background .3s ease-in-out;
    width: 14px
}

.BulletRow {
    align-items: center;
    display: inline-flex;
    gap: 1rem
}

.Bullet:active {
    scale: .95
}

.Bullet--active {
    background: var(--module-accent-colour, var(--colour-orange))
}

.bg-colour-dark .Bullet {
    background: var(--colour-white)
}

.bg-colour-dark .Bullet--active {
    background: var(--module-accent-colour, var(--colour-orange))
}

.ButtonRow {
    align-items: center
}

.ButtonRow,
.ButtonRow__container {
    display: flex;
    flex-wrap: wrap;
    gap: var(--s-spacing)
}

.ButtonRow__container {
    justify-content: center
}

.ButtonRow__container--left-align {
    justify-content: flex-start
}

.ButtonRow__container--small-gap {
    gap: 1rem
}

.ButtonRow__container--top-margin {
    margin-top: calc(var(--s-spacing)/2)
}

.ButtonRow__container--xl {
    margin-top: var(--m-spacing)
}

.Button a,
.Button button {
    align-items: center;
    border-radius: 100px;
    color: var(--button-colour);
    display: inline-flex;
    font-size: var(--font-size-s);
    gap: 13px;
    line-height: 1.15;
    position: relative;
    text-wrap: nowrap
}

.Button a:hover,
.Button button:hover {
    opacity: 1
}

.Button a:active,
.Button button:active {
    scale: .98
}

.Button a.active,
.Button button.active {
    scale: .94
}

.Button a:only-child,
.Button button:only-child {
    text-wrap: wrap
}

.Button button {
    border: none;
    cursor: pointer;
    font-family: var(--font-family-link);
    font-weight: var(--font-weight-bold);
    overflow: hidden
}

.Button--no-text a,
.Button--no-text button {
    height: 40px;
    width: 40px
}

.Button--no-text.Button--circle a,
.Button--no-text.Button--circle button {
    padding: 13px
}

.Button--mirror.Button--circle a,
.Button--mirror.Button--circle button,
.Button--mirror.Button--no-text a,
.Button--mirror.Button--no-text button {
    transform: rotate(180deg)
}

.Button--full.Button--xl a,
.Button--full.Button--xl button {
    color: var(--colour-black);
    font-size: var(--font-size-base);
    gap: 1rem;
    padding: 10px 22px 10px 18px
}

.Button--full.Button--xl a svg,
.Button--full.Button--xl button svg {
    height: 1rem;
    width: 1rem
}

.Button--full.Button--xl a svg path,
.Button--full.Button--xl button svg path {
    stroke: var(--colour-black)
}

.Button--full.Button--l a,
.Button--full.Button--l button {
    color: var(--colour-heading);
    font-size: var(--font-size-base);
    gap: .9rem;
    padding: 8px 20px 8px 16px
}

.Button--full.Button--l a svg,
.Button--full.Button--l button svg {
    height: .9rem;
    width: .9rem
}

.Button--full.Button--l a svg path,
.Button--full.Button--l button svg path {
    stroke: var(--colour-heading)
}

.Button--full a,
.Button--full button {
    border: 2px solid;
    padding: 10px 22px 10px 18px;
    position: relative;
    transition: all .3s ease-in-out, scale none;
    z-index: 1
}

.Button--full a svg,
.Button--full button svg {
    transition: all .3s ease-in-out;
    z-index: 1
}

.Button--full a svg path,
.Button--full button svg path {
    transition: stroke .3s ease-in-out
}

.Button--full a:after,
.Button--full button:after {
    background: var(--colour-purple-dark);
    border-radius: 100px;
    content: "";
    height: calc(100% + 4px);
    left: -2px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    top: -2px;
    transition: all .35s ease-in-out;
    width: 44px;
    z-index: -1
}

.Button--circle a,
.Button--circle button {
    align-items: center;
    background: none !important;
    display: inline-flex;
    gap: 26px;
    line-height: 1;
    padding: 13px 13px 13px 0
}

.Button--circle a svg,
.Button--circle button svg {
    transition: transform .3s ease-in-out;
    z-index: 1
}

.Button--circle a svg path,
.Button--circle button svg path {
    transition: stroke .3s ease-in-out
}

.Button--circle a:before,
.Button--circle button:before {
    border-radius: 50%;
    content: "";
    height: 40px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    transition: background .3s ease-in-out;
    width: 40px
}

.Button--plain-white a,
.Button--plain-white button {
    border-radius: 0;
    color: var(--colour-white);
    line-height: inherit
}

.Button--plain-white a svg,
.Button--plain-white button svg {
    transition: transform .3s ease-in-out
}

.Button--plain-white a svg path,
.Button--plain-white button svg path {
    stroke: var(--colour-white)
}

.Button--lavender a,
.Button--lavender button {
    background: var(--colour-lavender);
    border-color: var(--colour-lavender)
}

.Button--lavender a:before,
.Button--lavender button:before {
    background: var(--colour-lavender)
}

.Button--lavender-light a,
.Button--lavender-light button {
    background: var(--colour-lavender-light);
    border-color: var(--colour-lavender-light)
}

.Button--lavender-light a:before,
.Button--lavender-light button:before {
    background: var(--colour-lavender-light)
}

.Button--lavender-light a:after,
.Button--lavender-light button:after {
    background: var(--colour-lavender)
}

.Button--orange a,
.Button--orange button {
    background: var(--colour-orange);
    border-color: var(--colour-orange)
}

.Button--orange a:before,
.Button--orange button:before {
    background: var(--colour-orange)
}

.Button--orange-light a,
.Button--orange-light button {
    background: var(--colour-orange-light);
    border-color: var(--colour-orange-light)
}

.Button--orange-light a:before,
.Button--orange-light button:before {
    background: var(--colour-orange-light)
}

.Button--orange-light a:after,
.Button--orange-light button:after {
    background: var(--colour-orange)
}

.Button--green a,
.Button--green button {
    background: var(--colour-green);
    border-color: var(--colour-green)
}

.Button--green a:before,
.Button--green button:before {
    background: var(--colour-green)
}

.Button--green-light a,
.Button--green-light button {
    background: var(--colour-green-light);
    border-color: var(--colour-green-light)
}

.Button--green-light a:before,
.Button--green-light button:before {
    background: var(--colour-green-light)
}

.Button--green-light a:after,
.Button--green-light button:after {
    background: var(--colour-green)
}

.Button--dark.Button--circle a,
.Button--dark.Button--circle button {
    color: var(--colour-purple-dark)
}

.Button--dark a,
.Button--dark button {
    background: var(--colour-purple-dark);
    border-color: var(--colour-purple-dark);
    color: var(--colour-white)
}

.Button--dark a svg path,
.Button--dark button svg path {
    stroke: var(--colour-white)
}

.Button--dark a:before,
.Button--dark button:before {
    background: var(--colour-purple-dark)
}

.Button--white.Button--circle a,
.Button--white.Button--circle button {
    color: var(--colour-white)
}

.Button--white a,
.Button--white button {
    background: var(--colour-white);
    border-color: var(--colour-purple-dark)
}

.Button--white a:before,
.Button--white button:before {
    background: var(--colour-white)
}

.Button--error {
    border: 2px solid var(--colour-error);
    border-radius: 5px;
    padding: .5rem;
    position: relative
}

.Button--error:after {
    color: var(--colour-error);
    content: "Provide valid link";
    font-size: 13px;
    font-weight: 600;
    left: 0;
    line-height: 1rem;
    position: absolute;
    top: 0;
    transform: translateY(-100%);
    transform-origin: bottom left;
    z-index: 1
}

.Button--full-width {
    width: 100%
}

.Button--full-width a,
.Button--full-width button {
    align-items: center;
    display: flex;
    justify-content: center;
    margin: 0 auto;
    width: 100%
}

.CTAStrip .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:after,
.CTAStrip .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:after,
.CardComponent--cta-card .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:after,
.CardComponent--cta-card .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:after,
.CardComponent--dark-contained .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:after,
.CardComponent--dark-contained .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:after,
.ComparisonTable__heading-button-wrapper--recommended .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:after,
.ComparisonTable__heading-button-wrapper--recommended .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:after,
.SidebarBP:not(.SidebarBP--release-notes) .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:after,
.SidebarBP:not(.SidebarBP--release-notes) .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:after,
.SidebarCta .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:after,
.SidebarCta .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:after,
.bg-colour-dark .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:after,
.bg-colour-dark .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:after,
.bg-colour-purple-2 .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:after,
.bg-colour-purple-2 .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:after {
    background: var(--colour-white)
}

.CTAStrip .Button--circle a,
.CTAStrip .Button--circle button,
.CardComponent--cta-card .Button--circle a,
.CardComponent--cta-card .Button--circle button,
.CardComponent--dark-contained .Button--circle a,
.CardComponent--dark-contained .Button--circle button,
.ComparisonTable__heading-button-wrapper--recommended .Button--circle a,
.ComparisonTable__heading-button-wrapper--recommended .Button--circle button,
.SidebarBP:not(.SidebarBP--release-notes) .Button--circle a,
.SidebarBP:not(.SidebarBP--release-notes) .Button--circle button,
.SidebarCta .Button--circle a,
.SidebarCta .Button--circle button,
.bg-colour-dark .Button--circle a,
.bg-colour-dark .Button--circle button,
.bg-colour-purple-2 .Button--circle a,
.bg-colour-purple-2 .Button--circle button {
    color: var(--colour-white)
}

.CTAStrip .Button--dark a,
.CTAStrip .Button--dark button,
.CTAStrip .Button--white a,
.CTAStrip .Button--white button,
.CardComponent--cta-card .Button--dark a,
.CardComponent--cta-card .Button--dark button,
.CardComponent--cta-card .Button--white a,
.CardComponent--cta-card .Button--white button,
.CardComponent--dark-contained .Button--dark a,
.CardComponent--dark-contained .Button--dark button,
.CardComponent--dark-contained .Button--white a,
.CardComponent--dark-contained .Button--white button,
.ComparisonTable__heading-button-wrapper--recommended .Button--dark a,
.ComparisonTable__heading-button-wrapper--recommended .Button--dark button,
.ComparisonTable__heading-button-wrapper--recommended .Button--white a,
.ComparisonTable__heading-button-wrapper--recommended .Button--white button,
.SidebarBP:not(.SidebarBP--release-notes) .Button--dark a,
.SidebarBP:not(.SidebarBP--release-notes) .Button--dark button,
.SidebarBP:not(.SidebarBP--release-notes) .Button--white a,
.SidebarBP:not(.SidebarBP--release-notes) .Button--white button,
.SidebarCta .Button--dark a,
.SidebarCta .Button--dark button,
.SidebarCta .Button--white a,
.SidebarCta .Button--white button,
.bg-colour-dark .Button--dark a,
.bg-colour-dark .Button--dark button,
.bg-colour-dark .Button--white a,
.bg-colour-dark .Button--white button,
.bg-colour-purple-2 .Button--dark a,
.bg-colour-purple-2 .Button--dark button,
.bg-colour-purple-2 .Button--white a,
.bg-colour-purple-2 .Button--white button {
    border-color: var(--colour-white)
}

.CardComponent {
    display: flex;
    flex-direction: column;
    gap: var(--s-spacing);
    height: 100%;
    justify-content: space-between;
    position: relative;
    transition: all .3s ease-in-out
}

.CardComponent--horizontal {
    flex-direction: row;
    gap: var(--m-spacing);
    width: 100%
}

.CardComponent--horizontal .CardComponent--button-row {
    margin-top: var(--s-spacing)
}

.CardComponent--horizontal .CardComponent__left {
    flex: 3 1 30%
}

.CardComponent--horizontal .CardComponent__right {
    flex: 7 1 70%
}

.CardComponent--button-row {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem 1rem
}

.CardComponent--contained {
    background: var(--element-accent-colour-light)
}

.CardComponent--dark-contained {
    background: var(--colour-black)
}

.CardComponent--contained,
.CardComponent--cta-card,
.CardComponent--dark-contained {
    border-radius: var(--border-radius);
    overflow: hidden;
    padding: var(--m-spacing);
    z-index: 1
}

.CardComponent--contained .CardComponent__icon,
.CardComponent--cta-card .CardComponent__icon,
.CardComponent--dark-contained .CardComponent__icon {
    background: var(--element-accent-colour);
    border: none
}

.CardComponent--contained .CardComponent__bottom-button-wrapper,
.CardComponent--cta-card .CardComponent__bottom-button-wrapper,
.CardComponent--dark-contained .CardComponent__bottom-button-wrapper {
    display: flex;
    justify-content: flex-end
}

.CardComponent--cta-card :not(a):not(button),
.CardComponent--dark-contained :not(a):not(button) {
    color: var(--colour-white)
}

.CardComponent--cta-card .bg-decor-shape-wrapper,
.CardComponent--dark-contained .bg-decor-shape-wrapper {
    transform: none
}

.CardComponent--cta-card .bg-decor-shape-wrapper--lavender,
.CardComponent--dark-contained .bg-decor-shape-wrapper--lavender {
    bottom: 0;
    height: 70%;
    justify-content: flex-start;
    left: 0;
    right: auto
}

.CardComponent--cta-card .bg-decor-shape-wrapper--green,
.CardComponent--dark-contained .bg-decor-shape-wrapper--green {
    bottom: auto;
    height: 60%;
    top: 0
}

.CardComponent--cta-card .bg-decor-shape-wrapper--orange,
.CardComponent--dark-contained .bg-decor-shape-wrapper--orange {
    bottom: 0;
    height: 85%;
    justify-content: flex-start;
    left: 0;
    right: auto
}

.CardComponent--cta-card .bg-decor-shape-wrapper.bg-decor-shape-wrapper--mirror.bg-decor-shape-wrapper svg,
.CardComponent--dark-contained .bg-decor-shape-wrapper.bg-decor-shape-wrapper--mirror.bg-decor-shape-wrapper svg {
    transform: rotate(180deg)
}

.CardComponent--cta-card .bg-decor-shape-wrapper.bg-decor-shape-wrapper--mirror.bg-decor-shape-wrapper--lavender,
.CardComponent--dark-contained .bg-decor-shape-wrapper.bg-decor-shape-wrapper--mirror.bg-decor-shape-wrapper--lavender {
    bottom: auto;
    height: 70%;
    justify-content: flex-end;
    left: auto;
    right: 0;
    top: 0
}

.CardComponent--cta-card .bg-decor-shape-wrapper.bg-decor-shape-wrapper--mirror.bg-decor-shape-wrapper--green,
.CardComponent--dark-contained .bg-decor-shape-wrapper.bg-decor-shape-wrapper--mirror.bg-decor-shape-wrapper--green {
    bottom: 0;
    height: 60%;
    top: auto
}

.CardComponent--cta-card .bg-decor-shape-wrapper.bg-decor-shape-wrapper--mirror.bg-decor-shape-wrapper--orange,
.CardComponent--dark-contained .bg-decor-shape-wrapper.bg-decor-shape-wrapper--mirror.bg-decor-shape-wrapper--orange {
    bottom: auto;
    height: 85%;
    justify-content: flex-end;
    left: auto;
    right: 0;
    top: 0
}

.CardComponent--cta-card {
    align-items: center;
    background: var(--colour-black);
    gap: var(--m-spacing);
    padding: var(--xl-spacing);
    width: 100%
}

.CardComponent--cta-card--purple {
    background: var(--colour-purple-dark)
}

.CardComponent--cta-card .CardComponent__text {
    text-align: center
}

.CardComponent__top {
    display: flex;
    flex-direction: column;
    gap: var(--m-spacing)
}

.CardComponent__top img {
    transition: all .3s ease-in-out
}

.CardComponent__image {
    background: var(--element-accent-colour-light);
    border-radius: var(--border-radius);
    overflow: hidden
}

.CardComponent__image--contain img {
    -o-object-fit: contain !important;
    object-fit: contain !important
}

.CardComponent__image img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%
}

.CardComponent__icon {
    align-items: center;
    background: var(--element-accent-colour-light);
    border: 1px solid var(--colour-purple-dark-25);
    border-radius: 50%;
    display: flex;
    height: var(--xl-spacing);
    justify-content: center;
    transition: all .3s ease-out;
    width: var(--xl-spacing)
}

.CardComponent__icon img {
    height: auto;
    overflow: visible;
    width: 60%
}

.CardComponent__icon-2 {
    height: var(--l-spacing);
    transition: all .3s ease-out;
    width: var(--l-spacing)
}

.CardComponent__icon-2 img {
    height: auto;
    min-width: var(--l-spacing);
    overflow: visible;
    width: var(--l-spacing)
}

.CardComponent__top-el-wrapper {
    display: flex;
    gap: var(--m-spacing);
    justify-content: space-between
}

.CardComponent__optional-icon img {
    height: auto;
    min-width: var(--l-spacing);
    overflow: visible;
    width: var(--l-spacing)
}

.CardComponent__optional-icon--abs {
    margin: 0 !important;
    position: absolute;
    right: var(--m-spacing);
    top: var(--m-spacing)
}

.CardComponent__text--with-opt-icon h1,
.CardComponent__text--with-opt-icon h2,
.CardComponent__text--with-opt-icon h3,
.CardComponent__text--with-opt-icon h4,
.CardComponent__text--with-opt-icon h5,
.CardComponent__text--with-opt-icon h6 {
    padding-right: calc(var(--l-spacing) + 1rem)
}

.CardComponent__text p {
    color: var(--colour-paragraph)
}

.bg-colour-dark .CardComponent--contained .Button--circle a,
.bg-colour-dark .CardComponent--contained .Button--circle button {
    color: var(--button-colour)
}

.bg-colour-dark .CardComponent--linked.CardComponent:hover .CardComponent__bottom-button-wrapper .Button--circle.Button--lavender a:before,
.bg-colour-dark .CardComponent--linked.CardComponent:hover .CardComponent__bottom-button-wrapper .Button--circle.Button--orange a:before {
    background: var(--colour-green)
}

.bg-colour-dark .CardComponent--linked.CardComponent:hover .CardComponent__bottom-button-wrapper .Button--circle.Button--green a:before {
    background: var(--colour-orange)
}

.bg-colour-dark .CardComponent__icon {
    border: 1px solid var(--element-accent-colour)
}

.wrapper {
    margin: 0 auto;
    max-width: var(--wrapper);
    padding: 0 var(--margin);
    position: relative
}

.row {
    padding: var(--vertical-spacing) 0
}

.row--reduced-padding {
    padding: calc(var(--vertical-spacing)/2) 0
}

.row--no-top-padding {
    padding-top: 0
}

.row--no-bottom-padding {
    padding-bottom: 0
}

.sidebar-dnd .module .wrapper,
article .module .wrapper {
    padding: 0
}

.sidebar-dnd .module .wrapper .row,
article .module .wrapper .row {
    padding: calc(var(--vertical-spacing)/2) 0
}

.podcasts-article-wrapper .module .wrapper {
    padding: 0
}

.podcasts-article-wrapper .module .wrapper .row {
    padding: 0 0 calc(var(--vertical-spacing)/2) 0
}

.grid,
.slider-container--simplified .slider-wrapper {
    display: grid;
    grid-gap: var(--xl-spacing);
    gap: var(--xl-spacing)
}

.grid--medium-gap,
.slider-container--simplified .slider-wrapper {
    gap: var(--m-spacing)
}

.flex {
    display: flex;
    flex-direction: row;
    gap: var(--xl-spacing)
}

.flex--reverse {
    flex-direction: row-reverse
}

.stick-to-wrapper-left {
    flex: 1;
    margin-left: calc((var(--margin) + var(--border-radius))*-1)
}

.stick-to-wrapper-right {
    flex: 1;
    margin-right: calc((var(--margin) + var(--border-radius))*-1)
}

.header-dnd .module .wrapper {
    padding-top: var(--combined-nav-height)
}

.header-dnd--landing .module .wrapper {
    padding-top: calc(var(--nav-height) + var(--divider-height))
}

.custom-template,
.system-template {
    padding-top: var(--combined-nav-height)
}

.custom-template:before,
.system-template:before {
    background: linear-gradient(0deg, var(--colour-background) 0, var(--colour-lavender-light) 100%);
    content: "";
    height: 625px;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -2
}

.slider-container--simplified .slider-slide {
    padding-right: 0
}

.slider-container--simplified .slider-navigation {
    display: none
}

.slider-wrapper {
    display: flex;
    flex-wrap: nowrap;
    overflow: visible;
    transition: all .5s ease-in-out
}

.slider-slide {
    height: -moz-max-content;
    height: max-content;
    min-width: 45%;
    padding-right: var(--m-spacing);
    transition: all .3s ease-in-out
}

.slider-slide--post-card {
    min-width: 33.33%
}

.slider-slide--post-card--active {
    min-width: 49.995%
}

.slider-navigation {
    margin-top: var(--l-spacing)
}

.Divider {
    background: var(--colour-gradient-line);
    height: var(--divider-height);
    width: 100%
}

.SmallDivider {
    background: rgba(48, 27, 93, .25);
    height: 1px;
    width: 100%
}

.bg-colour-dark .SmallDivider {
    background: hsla(0, 0%, 100%, .25)
}

.EmbedComponent {
    align-items: center;
    box-shadow: var(--box-shadow);
    display: flex;
    height: auto;
    justify-content: center
}

.EmbedComponent,
.EmbedComponent iframe {
    border-radius: var(--border-radius);
    width: 100%
}

.EmbedComponent iframe {
    height: 100%
}

form input,
form select {
    border: 1px solid var(--colour-grey);
    border-radius: 5px;
    height: 50px;
    padding: .25rem .5rem
}

.HubSpotForm--on-dark-background form.hs-form {
    background: transparent !important
}

.HubSpotForm--on-dark-background .hs-form-field label * {
    color: var(--colour-white) !important
}

.HubSpotForm--on-dark-background .legal-consent-container .hs-richtext {
    color: var(--colour-white) !important;
    font-size: 12px !important
}

.HubSpotForm--on-dark-background .hs-button:hover {
    background: var(--colour-white) !important;
    border-color: var(--colour-white) !important;
    color: var(--colour-heading) !important;
    opacity: 1 !important
}

.HubSpotForm .hs_cos_wrapper {
    width: 100%
}

.HubSpotForm .form-title {
    color: var(--colour-heading);
    font-size: var(--font-size-h3)
}

.HubSpotForm h1,
.HubSpotForm h2,
.HubSpotForm h3,
.HubSpotForm h4,
.HubSpotForm h5,
.HubSpotForm h6 {
    color: var(--colour-heading) !important;
    font-size: var(--font-size-h3)
}

.HubSpotForm form.hs-form {
    background: var(--colour-white)
}

.HubSpotForm form.hs-form>*+*,
.HubSpotForm form.hs-form>fieldset+fieldset {
    margin: 1.5rem 0 0
}

.HubSpotForm form.hs-form .form-columns-1 {
    margin: 0 !important
}

.HubSpotForm form.hs-form .form-columns-1>div {
    margin: 1.5rem 0 0
}

.HubSpotForm form.hs-form .form-title,
.HubSpotForm form.hs-form fieldset {
    max-width: 100%
}

.HubSpotForm form.hs-form {
    margin: 0 auto;
    max-width: 100%
}

.HubSpotForm form.hs-form .hs-richtext.hs-main-font-element {
    margin: 16px 0 8px
}

.HubSpotForm form.hs-form .hs-richtext.hs-main-font-element>*+* {
    margin: 1em 0 0
}

.HubSpotForm form.hs-form .hs-form-field {
    float: none;
    max-width: 100%;
    width: 100%
}

.HubSpotForm form.hs-form .hs-form-field * {
    color: var(--colour-heading)
}

.HubSpotForm form.hs-form .hs-form-field label {
    display: block;
    font-weight: var(--font-weight-semibold)
}

.HubSpotForm form.hs-form .hs-form-field legend {
    padding: 0
}

.HubSpotForm form.hs-form .hs-field-desc {
    font-size: var(--font-size-xs)
}

.HubSpotForm form.hs-form .hs-field-desc br {
    display: none
}

.HubSpotForm form.hs-form .hs-error-msgs li {
    list-style: none
}

.HubSpotForm form.hs-form .hs-error-msgs li label {
    background: var(--colour-error);
    border-radius: 4px;
    color: var(--colour-white);
    display: inline-block;
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    letter-spacing: .024em;
    line-height: 1.5;
    margin: 8px 0 0;
    padding: 3px 9px
}

.HubSpotForm form.hs-form ::-moz-placeholder {
    color: #999
}

.HubSpotForm form.hs-form ::placeholder {
    color: #999
}

.HubSpotForm form.hs-form input.hs-input,
.HubSpotForm form.hs-form textarea.hs-input {
    background-color: var(--colour-white);
    border: 1px solid rgba(0, 0, 0, .25);
    border-radius: 5px;
    padding: 10px;
    width: 100%
}

.HubSpotForm form.hs-form input.hs-input.error,
.HubSpotForm form.hs-form input.hs-input.invalid,
.HubSpotForm form.hs-form textarea.hs-input.error,
.HubSpotForm form.hs-form textarea.hs-input.invalid {
    border-color: var(--colour-error)
}

.HubSpotForm form.hs-form textarea {
    min-height: 128px;
    resize: none
}

.HubSpotForm form.hs-form .input {
    margin-top: 6px
}

.HubSpotForm form.hs-form select.hs-input {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-color: var(--colour-white);
    border: 1px solid rgba(0, 0, 0, .25);
    border-radius: 5px;
    color: var(--colour-heading);
    max-width: 100%;
    padding: 10px;
    width: 100%
}

.HubSpotForm form.hs-form .inputs-list:not(.hs-error-msgs) {
    background-color: var(--colour-white);
    border: 1px solid;
    border: 1px solid rgba(0, 0, 0, .25);
    border-radius: 5px;
    padding: 10px
}

.HubSpotForm form.hs-form .inputs-list:not(.hs-error-msgs)>li {
    list-style: none
}

.HubSpotForm form.hs-form .inputs-list:not(.hs-error-msgs)>li+li {
    margin: 5px 0 0
}

.HubSpotForm form.hs-form .inputs-list:not(.hs-error-msgs)>li label {
    align-items: center;
    display: grid;
    font-weight: var(--font-weight-regular);
    grid-template-columns: minmax(0, 20px) minmax(0, 1fr)
}

.HubSpotForm form.hs-form .inputs-list:not(.hs-error-msgs)>li label input {
    cursor: pointer;
    height: auto
}

.HubSpotForm form.hs-form .inputs-list:not(.hs-error-msgs)>li label span {
    cursor: pointer;
    margin: 0 0 0 5px
}

.HubSpotForm form.hs-form fieldset.form-columns-0 .hs-richtext.hs-main-font-element {
    margin: 16px 0 0
}

.HubSpotForm form.hs-form fieldset[class^=form-columns-] {
    display: grid;
    grid-gap: 16px
}

.HubSpotForm form.hs-form fieldset[class^=form-columns-] .input {
    margin-right: 0
}

.HubSpotForm form.hs-form fieldset[class^=form-columns-] select.hs-input {
    max-width: 100%;
    width: 100%
}

.HubSpotForm form.hs-form fieldset[class^=form-columns-] input.hs-input,
.HubSpotForm form.hs-form fieldset[class^=form-columns-] textarea.hs-input {
    width: 100%
}

.HubSpotForm form.hs-form fieldset[class^=form-columns-] .hs-form-field {
    float: none;
    max-width: 100%;
    width: 100%
}

.HubSpotForm form.hs-form fieldset.form-columns-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr))
}

.HubSpotForm form.hs-form fieldset.form-columns-1 .hs-richtext.hs-main-font-element {
    grid-column: span 1
}

.HubSpotForm form.hs-form fieldset.form-columns-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr))
}

.HubSpotForm form.hs-form fieldset.form-columns-2 .hs-richtext.hs-main-font-element {
    grid-column: span 2
}

.HubSpotForm form.hs-form fieldset.form-columns-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr))
}

.HubSpotForm form.hs-form fieldset.form-columns-3 .hs-richtext.hs-main-font-element {
    grid-column: span 3
}

.HubSpotForm form.hs-form .legal-consent-container {
    border-radius: 5px
}

.HubSpotForm form.hs-form .legal-consent-container .inputs-list {
    background: var(--colour-white)
}

.HubSpotForm form.hs-form .legal-consent-container .hs-richtext {
    color: var(--colour-paragraph)
}

.HubSpotForm form.hs-form .legal-consent-container>*+* {
    margin: 8px 0 0
}

.HubSpotForm form.hs-form .legal-consent-container * {
    font-size: 13px
}

.HubSpotForm form.hs-form .legal-consent-container .hs-form-booleancheckbox-display>span {
    margin: 0 0 0 4px
}

.HubSpotForm form.hs-form .legal-consent-container .hs-form-booleancheckbox-display * {
    font-size: 13px
}

.HubSpotForm form.hs-form .hs-button {
    align-items: center;
    background: var(--module-accent-colour);
    border: 2px solid;
    border-color: var(--module-accent-colour);
    border-radius: 100px;
    color: var(--button-colour);
    cursor: pointer;
    display: inline-flex;
    font-family: var(--font-family-link);
    font-size: var(--font-size-s);
    font-weight: var(--font-weight-bold);
    gap: 13px;
    height: auto;
    line-height: 1;
    overflow: hidden;
    padding: 11px 22px 11px 18px;
    position: relative;
    text-wrap: nowrap;
    transition: all .3s ease-in-out, scale 0s;
    z-index: 1
}

.HubSpotForm form.hs-form .hs-button:hover {
    background: var(--colour-purple-dark);
    border-color: var(--colour-purple-dark);
    color: var(--colour-white);
    opacity: 1
}

.HubSpotForm form.hs-form .hs-button:active {
    scale: .98
}

.HubSpotForm .submitted-message {
    font-weight: 600;
    text-align: left;
    width: 100%
}

.FormComponent {
    -webkit-backdrop-filter: blur(9.4489622116px);
    backdrop-filter: blur(9.4489622116px);
    background: hsla(0, 0%, 100%, .6);
    border: 2px solid var(--colour-white);
    border-radius: var(--border-radius);
    box-shadow: 0 3.937px 12.599px 0 rgba(0, 0, 0, .1);
    width: 100%
}

.FormComponent__container {
    position: relative;
    transition: all .3s ease
}

.FormComponent__container,
.FormComponent__container--two-column {
    background: var(--colour-white);
    border-radius: 6px;
    margin: calc(var(--m-spacing)/2)
}

.FormComponent__container--two-column {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: var(--m-spacing);
    gap: var(--m-spacing);
    overflow: hidden
}

.FormComponent__inner {
    display: flex;
    flex-direction: column;
    gap: var(--s-spacing);
    padding: var(--m-spacing);
    position: relative;
    transition: all .3s ease
}

.FormComponent__custom-title {
    align-items: center;
    color: var(--colour-heading) !important;
    display: flex;
    gap: var(--s-spacing);
    text-align: left;
    width: 100%
}

.FormComponent__custom-title img {
    height: auto;
    -o-object-fit: contain;
    object-fit: contain;
    width: 50px
}

.FormComponent__image {
    align-items: center;
    background: #e6e6e6;
    border-radius: var(--border-radius);
    border-radius: calc(var(--border-radius)*3);
    display: flex;
    height: auto;
    justify-content: center;
    margin: var(--m-spacing) 0;
    width: 130%
}

.FormComponent__image img {
    border-radius: calc(var(--border-radius)*1.5);
    height: calc(100% - 2rem);
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: left;
    object-position: left;
    width: calc(100% - 2rem)
}

.KeyBenefitsComponent {
    display: flex;
    flex-direction: column;
    gap: var(--s-spacing)
}

.KeyBenefitsComponent__title {
    text-transform: uppercase
}

.KeyBenefitsComponent__benefits-container {
    display: flex;
    flex-direction: column;
    gap: var(--s-spacing);
    margin-top: calc(var(--s-spacing)/2)
}

.KeyBenefitsComponent__benefit {
    align-items: center;
    display: flex;
    gap: var(--s-spacing);
    justify-content: flex-start;
    width: 100%
}

.KeyBenefitsComponent__icon {
    aspect-ratio: 1/1;
    background-color: var(--module-accent-colour);
    background-image: var(--check-mark);
    background-position: 50%;
    background-repeat: no-repeat;
    border-radius: 50%;
    height: 28px;
    min-width: 28px;
    width: 28px
}

.KeyBenefitsComponent__icon--dark {
    background-color: var(--colour-purple-dark);
    background-image: var(--check-mark-white)
}

.KeyBenefitsComponent__text {
    width: 100%
}

.LogoRow__container {
    display: flex;
    flex-wrap: wrap;
    gap: 2.5rem .75rem;
    justify-content: center;
    width: 100%;
    --logo-gap: 2rem
}

.LogoRow__container--hero {
    flex-wrap: nowrap;
    justify-content: flex-start;
    margin-top: var(--s-spacing)
}

.LogoRow__logo-wrapper {
    align-items: center;
    display: flex;
    flex: 0 0 calc(50% - var(--logo-gap));
    height: auto;
    justify-content: center
}

.LogoRow__logo-wrapper img {
    height: 44px;
    -o-object-fit: contain;
    object-fit: contain;
    width: 110px
}

.LogoRow__logo-wrapper--greyscale img {
    filter: grayscale(1);
    opacity: .7
}

.LogoRow__logo-wrapper--hero {
    flex: initial
}

.LogoRow__logo-wrapper--hero.LogoRow__logo-wrapper img {
    max-height: 48px;
    max-width: 120px;
    opacity: .5
}

.LogoRow__logo-wrapper--case-study,
.LogoRow__logo-wrapper--left-align,
.LogoRow__logo-wrapper--testimonials,
.LogoRow__logo-wrapper--timeline {
    justify-content: flex-start
}

.LogoRow__logo-wrapper--case-study img,
.LogoRow__logo-wrapper--left-align img,
.LogoRow__logo-wrapper--testimonials img,
.LogoRow__logo-wrapper--timeline img {
    max-height: 75px;
    padding: 10px 10px 10px 0;
    width: auto !important
}

.LogoRow__logo-wrapper--large img {
    height: 100px !important;
    max-height: none !important;
    max-width: none !important
}

.Pagination {
    align-items: center;
    display: flex;
    gap: .5rem;
    justify-content: center
}

.Pagination--new {
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: flex-start;
    margin-top: calc(var(--m-spacing)*2)
}

.Pagination--new .Pagination__buttons {
    display: flex;
    gap: .5rem
}

.Pagination--new .Pagination__buttons button {
    background: var(--colour-lavender-light);
    border: none;
    border-radius: 4px;
    cursor: pointer;
    min-width: 32px;
    padding: 0;
    transition: all .2s ease-in-out
}

.Pagination--new .Pagination__buttons button a {
    color: var(--colour-purple-dark);
    display: inline-block;
    font-size: 14px;
    font-weight: var(--font-weight-semibold);
    padding: 2px .75rem
}

.Pagination--new .Pagination__buttons button:hover {
    background: var(--colour-lavender)
}

.Pagination--new .Pagination__buttons button:hover a {
    color: var(--colour-white)
}

.Pagination--new .Pagination__buttons button:hover a svg path {
    fill: var(--colour-white)
}

.Pagination--new .Pagination__buttons button:disabled {
    cursor: default;
    opacity: .2;
    pointer-events: none
}

.Pagination--new .Pagination__buttons button:disabled:hover {
    background: var(--colour-lavender-light)
}

.Pagination--new .Pagination__buttons button:disabled:hover a {
    color: var(--colour-purple-dark)
}

.Pagination--new .Pagination__buttons button.active {
    background: var(--colour-purple-dark);
    cursor: default;
    opacity: 1;
    pointer-events: none
}

.Pagination--new .Pagination__buttons button.active a {
    color: var(--colour-white);
    display: inline-block
}

.Pagination--new .Pagination__buttons button.active:hover {
    background: var(--colour-purple-dark)
}

.Pagination--new .Pagination__buttons button.active:hover a {
    color: var(--colour-white)
}

.Pagination--new .Pagination__buttons button.active:hover a svg path {
    fill: var(--colour-white)
}

.Pagination--new .Pagination__info {
    color: var(--colour-purple-dark);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold)
}

.Pagination__next a,
.Pagination__prev a {
    border: 2px solid var(--colour-purple-dark);
    border-radius: 100px;
    color: var(--colour-purple-dark);
    padding: 8px 16px;
    transition: all .3s ease-in-out
}

.Pagination__next a:hover,
.Pagination__prev a:hover {
    background: var(--colour-purple-dark);
    color: var(--colour-white);
    opacity: 1
}

.Pagination__numbers {
    display: flex;
    gap: .5rem
}

.Pagination__number--active a {
    background: var(--colour-purple-dark);
    color: var(--colour-white)
}

.Pagination__number a {
    align-items: center;
    aspect-ratio: 1/1;
    display: flex;
    justify-content: center;
    -webkit-text-decoration: underline;
    text-decoration: underline;
    transition: all .3s ease-in-out;
    width: 36px
}

.Pagination__number a:hover {
    background: var(--colour-purple-dark);
    color: var(--colour-white)
}

.PostCard {
    background-color: #120728;
    border-radius: var(--border-radius);
    height: 300px;
    overflow: hidden;
    position: relative
}

.PostCard:hover .PostCard__image {
    transform: scale(1.1)
}

.PostCard:hover .PostCard__button a {
    opacity: 1
}

.PostCard:hover .PostCard__button a:after {
    background-color: var(--colour-lavender);
    transform: rotate(-45deg)
}

.PostCard:before {
    background: linear-gradient(180deg, rgba(18, 7, 40, .1), #120728);
    content: "";
    z-index: 1
}

.PostCard:before,
.PostCard__image {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.PostCard__image {
    -o-object-fit: cover;
    object-fit: cover;
    transition: all .3s ease-in-out;
    z-index: 0
}

.PostCard__inner {
    bottom: 0;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: flex-end;
    padding: var(--s-spacing);
    position: absolute;
    width: 100%;
    z-index: 2
}

.PostCard__date,
.PostCard__description,
.PostCard__title {
    color: var(--colour-white)
}

.PostCard__date {
    font-size: var(--font-size-base)
}

.PostCard__title {
    font-size: var(--font-size-h5);
    line-height: var(--line-height-h5)
}

.PostCard__topics {
    display: flex;
    flex-wrap: wrap;
    gap: var(--s-spacing)
}

.PostCard__topic {
    background: var(--colour-lavender-light);
    border-radius: 100px;
    color: var(--colour-heading);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    line-height: 1;
    padding: 10px 20px;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    z-index: 4
}

.PostCard__button {
    margin: 1rem 0 0
}

.PostCard__button a {
    align-items: center;
    color: var(--colour-white);
    display: flex;
    gap: 1rem
}

.PostCard__button a:before {
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 3
}

.PostCard__button a:after {
    background-color: var(--colour-white);
    background-image: var(--icon-arrow);
    background-position: 50%;
    background-repeat: no-repeat;
    border-radius: 100%;
    content: "";
    display: inline-block;
    height: 40px;
    transition: all .3s ease-in-out;
    width: 40px
}

.NewPostCard {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    transition: all 1.25s cubic-bezier(.64, -.32, .24, 1.1);
    z-index: 0
}

.NewPostCard:hover:not(:has(.NewPostCard__podcast-logo-link:hover)) .NewPostCard__title {
    color: var(--colour-lavender)
}

.NewPostCard:hover:not(:has(.NewPostCard__podcast-logo-link:hover)) .NewPostCard__image img {
    transform: scale(1.1);
    z-index: 0
}

.NewPostCard--podcasts-hero:hover:not(:has(.NewPostCard__podcast-logo-link:hover)) .NewPostCard__title {
    color: var(--colour-lavender) !important
}

.NewPostCard--podcasts-hero .NewPostCard__image {
    border-radius: 0;
    display: flex;
    justify-content: flex-end;
    margin-bottom: var(--m-spacing);
    overflow: visible
}

.NewPostCard--podcasts-hero .NewPostCard__image img {
    aspect-ratio: 1/1;
    border-radius: .75rem;
    -o-object-fit: cover !important;
    object-fit: cover !important;
    width: 20%
}

.NewPostCard--podcasts-hero .NewPostCard__tag {
    background: var(--colour-green) !important;
    color: var(--colour-purple-dark) !important;
    left: 0;
    right: auto
}

.NewPostCard--podcasts-hero .NewPostCard__podcast-logo-link {
    background: var(--colour-purple-dark);
    right: 50px
}

.NewPostCard--podcasts-hero .NewPostCard__podcast-logo-link:last-child {
    right: 0
}

.NewPostCard--podcasts-hero--dark .NewPostCard__podcast-logo-link {
    background: var(--colour-white)
}

.NewPostCard--podcasts-hero--dark .NewPostCard__button a {
    color: var(--colour-white)
}

.NewPostCard__image {
    border-radius: .75rem;
    overflow: hidden;
    position: relative
}

.NewPostCard__image img {
    aspect-ratio: 16/10;
    height: auto;
    -o-object-fit: cover;
    object-fit: cover;
    position: relative;
    transition: transform 1.5s cubic-bezier(.24, .48, .44, 1.04);
    width: 100%;
    z-index: 0
}

.NewPostCard__tag {
    background: var(--colour-lavender-light);
    border-radius: 1.25rem;
    color: var(--colour-purple-dark);
    font-size: 13px;
    font-weight: var(--font-weight-semibold);
    padding: 3px 10px;
    position: absolute;
    right: .75rem;
    top: .75rem;
    z-index: 1
}

.NewPostCard__tag--featured-podcast {
    background: var(--colour-green)
}

.NewPostCard__text {
    padding: .25rem 0 0;
    position: relative
}

.NewPostCard__date {
    color: var(--colour-purple-dark);
    display: inline-block;
    font-size: var(--font-size-s);
    font-weight: var(--font-weight-semibold);
    margin: 0 0 1.5rem
}

.NewPostCard__title {
    font-size: var(--font-size-base);
    transition: color .32s ease
}

.NewPostCard__podcast-logo-link {
    align-items: center;
    background: var(--colour-purple-dark);
    border: 1px solid rgba(49, 19, 94, .25);
    border-radius: 3px;
    display: flex;
    height: 40px;
    justify-content: center;
    position: absolute;
    right: 70px;
    top: .5rem;
    width: 40px;
    z-index: 10
}

.NewPostCard__podcast-logo-link:last-child {
    right: 20px
}

.NewPostCard__podcast-logo-link img {
    height: 25px !important;
    -o-object-fit: contain;
    object-fit: contain;
    width: 25px !important
}

.NewPostCard__button {
    margin: 1rem 0 0
}

.NewPostCard__button a {
    align-items: center;
    color: var(--colour-purple-dark);
    display: inline-block;
    display: flex;
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    gap: .5rem
}

.NewPostCard__button a:hover {
    opacity: 1
}

.NewPostCard__button a:after {
    --icon-size: 1.5rem;
    background: var(--arrow-icon);
    background-color: var(--colour-purple-dark);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 30%;
    border-radius: 100%;
    content: "";
    display: inline-block;
    flex: 0 0 var(--icon-size);
    height: var(--icon-size);
    transition: all .32s ease;
    width: var(--icon-size)
}

.NewPostCard__button a:before {
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1
}

.NewPostCard__button a:hover:after {
    background-color: var(--colour-lavender);
    transform: rotate(-45deg)
}

.SocialMedia {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--s-spacing);
    margin: calc(var(--m-spacing)/2) 0
}

.SocialMedia--meet-the-host {
    border-top: 1px solid rgba(29, 8, 67, .25);
    margin: 0;
    padding-top: var(--m-spacing)
}

.SocialMedia--meet-the-host .SocialMedia__title {
    font-size: var(--font-size-h5);
    line-height: var(--line-height-h5)
}

.SocialMedia--sidebar {
    gap: var(--m-spacing);
    margin-bottom: 0
}

.SocialMedia--sidebar .SocialMedia__icons {
    background: none;
    border-radius: 0;
    padding: 12px 0
}

.SocialMedia--sidebar .SocialMedia__item:hover {
    filter: brightness(2)
}

.SocialMedia__title {
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h6);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-h6);
    text-wrap: nowrap
}

.SocialMedia__item {
    position: relative;
    transition: all .2s ease-in-out
}

.SocialMedia__item:after {
    bottom: -10px;
    content: "";
    left: -10px;
    position: absolute;
    right: -10px;
    top: -10px
}

.SocialMedia__item:hover {
    filter: brightness(.8)
}

.SocialMedia__icons {
    background: var(--colour-purple-dark);
    border-radius: 100px;
    display: flex;
    gap: var(--m-spacing);
    padding: 12px 18px
}

.SocialMedia__icons img {
    height: 20px;
    max-height: 20px;
    -o-object-fit: contain;
    object-fit: contain;
    width: auto
}

.bg-colour-dark .SocialMedia--meet-the-host {
    border-top: 1px solid hsla(0, 0%, 100%, .25)
}

.bg-colour-dark .SocialMedia__icons {
    background: var(--colour-green)
}

.sidebar-wrapper--blog-post .sidebar-post {
    margin: 0 auto;
    max-width: 680px;
    width: 100%
}

.sidebar-wrapper--blog-post .sidebar-left-side-modules {
    margin-bottom: 0
}

.sidebar-dnd,
.sidebar-post {
    grid-column: 2;
    grid-row: 1;
    max-width: 100%;
    width: auto
}

.sidebar-left-side-modules {
    display: flex;
    flex-direction: column;
    gap: var(--s-spacing);
    grid-column: 1;
    grid-row: 1;
    height: -moz-max-content;
    height: max-content;
    margin: calc(var(--vertical-spacing)/2) 0;
    min-width: 300px;
    position: sticky;
    top: var(--combined-nav-height);
    width: 100%
}

.sidebar-left-side-modules li,
.sidebar-left-side-modules ul {
    opacity: 1
}

.StatsItem {
    display: flex
}

.StatsItem__border {
    background: var(--element-accent-colour);
    border-radius: 1rem;
    height: 100%;
    opacity: 0;
    overflow: hidden;
    transform: translateY(50px) scaleY(0);
    transform-origin: bottom;
    transition: all 2s cubic-bezier(.16, .88, .36, 1.02);
    width: 5px
}

.StatsItem.animate .StatsItem__border {
    opacity: 1;
    transform: none
}

.StatsItem__wrapper {
    display: flex;
    flex-direction: column;
    gap: 50px;
    padding-left: var(--m-spacing)
}

.StatsItem__stat {
    letter-spacing: -.08em
}

.StatsItem__description {
    color: var(--colour-purple-dark);
    max-width: 380px
}

.TabsComponent {
    display: flex;
    flex-direction: column;
    gap: .5rem
}

.TabsComponent__tab-wrapper {
    align-items: center;
    cursor: pointer;
    display: flex;
    gap: var(--s-spacing)
}

.TabsComponent__tab-wrapper--active .TabsComponent__indicator {
    background: var(--element-accent-colour)
}

.TabsComponent__indicator,
.TabsComponent__tab-wrapper--active .TabsComponent__tab {
    background: var(--element-accent-colour-light)
}

.TabsComponent__indicator {
    border-radius: 1rem;
    height: 48px;
    width: 8px
}

.TabsComponent__tab {
    background: none;
    border-radius: var(--border-radius);
    padding: calc(var(--s-spacing)*.75) var(--s-spacing);
    text-wrap: wrap;
    transition: background .32s ease-in-out, box-shadow .32s ease-in-out;
    width: 100%
}

.Tag {
    background: var(--colour-lavender-light);
    border-radius: 16px;
    color: var(--colour-purple-dark);
    font-size: 13px;
    padding: 4px 12px;
    text-wrap: nowrap
}

.TagRow {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin: 2rem 0 0
}

.TestimonialsComponent {
    display: flex;
    flex-direction: column;
    gap: var(--s-spacing)
}

.TestimonialsComponent__label {
    text-transform: uppercase
}

.TestimonialsComponent__top-row {
    align-items: center;
    display: flex;
    gap: var(--m-spacing);
    justify-content: space-between
}

.TestimonialsComponent__testimonials-container {
    margin: var(--s-spacing) 0;
    position: relative
}

.TestimonialsComponent__testimonial {
    display: flex;
    flex-direction: column;
    gap: var(--s-spacing);
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: opacity 1.5s ease;
    visibility: hidden
}

.TestimonialsComponent__testimonial--active {
    opacity: 1;
    position: static;
    visibility: visible
}

.VideoComponent {
    aspect-ratio: 16/9;
    border-radius: var(--border-radius);
    overflow: hidden;
    position: relative;
    width: 100%
}

.VideoComponent__facade {
    cursor: pointer;
    pointer-events: all;
    transition: opacity 1s ease-in .2s
}

.VideoComponent__facade:hover .VideoComponent__thumb {
    filter: brightness(.72)
}

.VideoComponent__facade:hover .VideoComponent__play-btn button {
    background: var(--module-accent-colour, var(--colour-green));
    border-color: var(--colour-purple-dark)
}

.VideoComponent__facade:hover .VideoComponent__play-btn button span {
    transform: translateX(6px)
}

.VideoComponent__facade:hover .VideoComponent__play-btn button:after {
    opacity: 1;
    width: calc(100% + 4px)
}

.VideoComponent__facade:active .VideoComponent__play-btn button {
    scale: .98
}

.VideoComponent__facade.fade-out {
    opacity: 0;
    pointer-events: none
}

.VideoComponent__facade.fade-out .VideoComponent__thumb {
    filter: brightness(.72)
}

.VideoComponent__thumb {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: all .3s ease-in-out;
    width: 100%;
    z-index: 2
}

.VideoComponent__thumb img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%
}

.VideoComponent__play-btn {
    border: none;
    left: 50%;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translate3d(-50%, -50%, 0);
    transition: all .3s ease-in-out;
    z-index: 3
}

.VideoComponent__play-btn button {
    border-color: var(--colour-white);
    color: var(--colour-purple-dark) !important
}

.VideoComponent__play-btn button:after {
    background: var(--colour-white)
}

.VideoComponent__play-btn button span {
    background-image: var(--play-btn-svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    height: 28px;
    transition: all .3s ease-in-out;
    width: 24px
}

.VideoComponent__iframe {
    bottom: 0;
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 1
}

.VideoComponent__iframe iframe {
    aspect-ratio: 16/9;
    border: none;
    height: auto;
    width: 100%
}

.VideoComponent--wistia {
    border-radius: var(--border-radius);
    height: auto;
    overflow: hidden
}

.VideoComponent--wistia,
.VideoComponent--wistia>div {
    aspect-ratio: 16/9;
    max-width: 100% !important;
    width: 100% !important
}

.VideoComponent--wistia>div {
    height: 100% !important;
    overflow: hidden !important
}

.VideoComponent--wistia--with-facade .wistia_embed {
    bottom: 0;
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 1
}

.Tooltip {
    --offset: 50px;
    background-color: var(--colour-purple-dark);
    background-image: var(--tooltip-i);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 35%;
    border-radius: 50%;
    display: inline-block;
    height: 14px;
    margin-left: .3rem;
    position: relative;
    width: 14px
}

.Tooltip--visible .Tooltip__message {
    opacity: 1
}

.Tooltip__message {
    border: 1px solid rgba(48, 27, 93, .2);
    border-radius: 10px;
    bottom: 45px;
    font-family: var(--font-family-body);
    font-size: 14px;
    font-weight: var(--font-weight-regular);
    left: calc(var(--offset)*-1);
    line-height: 160%;
    opacity: 0;
    padding: calc(var(--m-spacing)/2);
    pointer-events: none;
    transform-origin: bottom left;
    transition: opacity .1s ease-in-out;
    width: 400px;
    z-index: 1
}

.Tooltip__message,
.Tooltip__message:before {
    background: var(--colour-white);
    position: absolute
}

.Tooltip__message:before {
    border: 1px solid rgba(48, 27, 93, .2);
    border-left: none;
    border-top: none;
    bottom: -15.5px;
    content: "";
    height: 30px;
    left: calc(var(--offset) - 7.5px);
    transform: rotate(45deg);
    transform-origin: center;
    width: 30px;
    z-index: -1
}

.Player__title {
    margin-bottom: calc(var(--m-spacing)/2)
}

.Player__outer-container {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--s-spacing)
}

.Player__container {
    align-items: center;
    background: rgba(49, 19, 94, .15);
    border: 1px solid rgba(49, 19, 94, .25);
    border-radius: 90px;
    display: flex;
    gap: 10px;
    padding: 10px
}

.Player__play-button {
    background-color: var(--module-accent-colour);
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' width='12' height='12' viewBox='-16 0 320.001 320.001'%3E%3Cpath fill='%2331135e' d='m295.84 146.049-256-144a16.03 16.03 0 0 0-15.904.128A15.99 15.99 0 0 0 16 16.001v288a15.99 15.99 0 0 0 7.936 13.824A16.14 16.14 0 0 0 32 320.001c2.688 0 5.408-.672 7.84-2.048l256-144c5.024-2.848 8.16-8.16 8.16-13.952s-3.136-11.104-8.16-13.952' data-original='%23000000'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 12px;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    height: 32px;
    transition: all .2s ease-in-out;
    width: 32px
}

.Player__play-button:hover {
    opacity: .8
}

.Player__play-button.player-playing {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' width='12' height='12' viewBox='0 0 32 32'%3E%3Cpath fill='%2331135e' d='M13 5v22a3 3 0 0 1-3 3H9a3 3 0 0 1-3-3V5a3 3 0 0 1 3-3h1a3 3 0 0 1 3 3m10-3h-1a3 3 0 0 0-3 3v22a3 3 0 0 0 3 3h1a3 3 0 0 0 3-3V5a3 3 0 0 0-3-3' data-name='Layer 30' data-original='%23000000'/%3E%3C/svg%3E")
}

.Player input[type=range] {
    --track-width: 200px;
    --track-height: 8px;
    --thumb-size: 8px;
    --min: 0;
    --max: 10000;
    --range: calc(var(--max) - var(--min));
    --ratio: calc((var(--value) - var(--min))/var(--range));
    --sx: calc(var(--thumb-size)/2 + var(--ratio)*(100% - var(--thumb-size)));
    -webkit-appearance: none;
    background: var(--colour-white);
    border-radius: var(--track-height);
    width: var(--track-width)
}

.Player input[type=range]:focus {
    outline: none
}

.Player input[type=range]::-webkit-slider-runnable-track {
    background: linear-gradient(var(--module-accent-colour), var(--module-accent-colour)) 0/var(--sx) 100% no-repeat, var(--colour-white);
    border: none;
    border-radius: var(--track-height);
    cursor: pointer;
    height: var(--track-height);
    width: var(--track-width)
}

.Player input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    background: var(--module-accent-colour);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    height: var(--thumb-size);
    margin-top: calc((var(--thumb-size) - var(--track-height))/-2);
    position: relative;
    width: var(--thumb-size)
}

.Player input[type=range]::-moz-range-track {
    background: linear-gradient(var(--module-accent-colour), var(--module-accent-colour)) 0/var(--sx) 100% no-repeat, var(--colour-white);
    border: none;
    border-radius: var(--track-height);
    cursor: pointer;
    height: var(--track-height);
    width: var(--track-width)
}

.Player input[type=range]::-moz-range-thumb {
    background: var(--module-accent-colour);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    height: var(--thumb-size);
    width: var(--thumb-size)
}

.Player input[type=range]::-ms-track {
    background: var(--colour-white);
    border: none;
    border-radius: var(--track-height);
    color: transparent;
    cursor: pointer;
    height: var(--track-height);
    width: var(--track-width)
}

.Player input[type=range]::-ms-fill-lower {
    background: var(--module-accent-colour)
}

.Player input[type=range]::-ms-fill-upper {
    background: transparent
}

.Player input[type=range]::-ms-thumb {
    background: var(--module-accent-colour);
    border-radius: 50%;
    cursor: pointer;
    height: var(--thumb-size);
    width: var(--thumb-size)
}

.Player__times-container {
    align-items: center;
    display: flex;
    gap: 3px;
    justify-content: center;
    position: relative;
    width: 74px
}

.Player__times-container span {
    font-size: 14px
}

.Player__times-container span:first-child {
    left: 0;
    position: absolute;
    top: 0
}

.Player__times-container span:last-child {
    position: absolute;
    right: 0;
    top: 0
}

.Player--dark .Player__container {
    background: hsla(0, 0%, 100%, .25)
}

.Player--dark .Player__times-container span {
    color: var(--colour-white)
}

.Accordion__container {
    margin: 0 auto;
    width: 75%
}

.Accordion__items {
    display: flex;
    flex-direction: column;
    gap: var(--m-spacing);
    width: 100%
}

.Accordion__items .Accordion__tab {
    background: var(--module-accent-colour-light);
    border-radius: var(--border-radius);
    cursor: pointer;
    padding: var(--m-spacing);
    padding-bottom: 0;
    width: 100%
}

.Accordion__items .Accordion__tab--active .Accordion__question:after {
    transform: rotate(180deg)
}

.Accordion__items .Accordion__tab--active .Accordion__answer {
    display: block;
    height: auto;
    opacity: 1;
    padding-bottom: var(--m-spacing)
}

.Accordion__items .Accordion__tab--active .Accordion__answer * {
    font-size: var(--font-size-base);
    line-height: var(--line-height-body)
}

.Accordion__items .Accordion__tab:active .Accordion__question {
    color: var(--module-accent-colour)
}

.Accordion__items .Accordion__question {
    align-items: center;
    display: flex;
    gap: var(--s-spacing);
    justify-content: space-between;
    margin-bottom: var(--m-spacing);
    transition: color .2s ease;
    width: 100%
}

.Accordion__items .Accordion__question:after {
    background-image: var(--accordion-btn);
    background-position: 50%;
    background-repeat: no-repeat;
    content: "";
    height: 41px;
    min-width: 41px;
    transition: all .3s ease-in-out;
    width: 41px
}

.Accordion__items .Accordion__answer {
    color: var(--colour-paragraph) !important;
    display: none;
    height: 0;
    opacity: 0;
    padding-bottom: 0;
    transition: all .3s ease-in-out
}

.Accordion__items .Accordion__answer-list>*+* {
    border-top: 1px solid rgba(48, 27, 93, .1);
    margin-top: var(--s-spacing);
    padding-top: var(--s-spacing)
}

.SidebarBP {
    display: flex;
    flex-direction: column;
    gap: var(--s-spacing);
    width: 100%
}

.SidebarBP--release-notes {
    background: var(--colour-lavender-light);
    border-radius: var(--border-radius);
    gap: var(--flow);
    padding: var(--s-spacing)
}

.SidebarBP--release-notes .SidebarBP__divider {
    background: var(--colour-purple-dark);
    border-radius: 50%;
    height: 1px;
    opacity: .25;
    width: 100%
}

.SidebarBP--release-notes .SidebarBP__title--table {
    margin: 1.5rem 0 0
}

.SidebarBP--release-notes .SidebarBP__table-of-contents-list {
    margin-left: 18px;
    position: relative
}

.SidebarBP--release-notes .SidebarBP__table-of-contents-list:before {
    background: #cdc7e6;
    border-radius: 3px;
    content: "";
    height: 100%;
    left: -18px;
    position: absolute;
    top: 0;
    width: 6px
}

.SidebarBP--release-notes .SidebarBP__link {
    cursor: pointer;
    font-size: var(--font-size-s);
    line-height: 1rem;
    list-style: none;
    padding: .5rem 0 !important;
    position: relative;
    transition: color .2s ease-in-out
}

.SidebarBP--release-notes .SidebarBP__link:before {
    background: #cdc7e6;
    border-radius: 3px;
    bottom: 0;
    content: "";
    height: 10%;
    left: -18px;
    position: absolute;
    transition: all .2s ease-out;
    width: 6px
}

.SidebarBP--release-notes .SidebarBP__link:hover {
    color: var(--colour-lavender)
}

.SidebarBP--release-notes .SidebarBP__link--level-H3 {
    padding-left: 12px !important
}

.SidebarBP--release-notes .SidebarBP__link--level-H4 {
    padding-left: 24px !important
}

.SidebarBP--release-notes .SidebarBP__link--active {
    color: #6947ff
}

.SidebarBP--release-notes .SidebarBP__link--active:before {
    background: #6947ff;
    height: 100%
}

.SidebarBP__title {
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h6);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-h6)
}

.SidebarBP__cta,
.SidebarBP__links {
    border-radius: var(--border-radius);
    padding: var(--s-spacing)
}

.SidebarBP__cta {
    background: var(--colour-purple-dark);
    color: var(--colour-white)
}

.SidebarBP__links {
    background: var(--colour-lavender-light)
}

.SidebarBP__articles ul {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    list-style: none;
    margin: 1rem 0 0;
    padding: 0
}

.SidebarBP__article {
    color: var(--colour-purple-dark);
    display: inline-grid;
    font-size: 14px;
    gap: .5rem;
    grid-template-columns: auto 16px;
    line-height: 140%;
    width: 100%
}

.SidebarBP__article:after {
    background-image: var(--icon-article-arrow);
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: inline-block;
    height: 16px;
    margin: 3px 0 0;
    transition: all .2s ease-in-out;
    width: 16px
}

.SidebarBP__article:hover {
    opacity: .8
}

.SidebarBP__article:hover:after {
    filter: brightness(.8);
    transform: rotate(-45deg)
}

.SidebarBP__share {
    align-items: center;
    display: flex;
    gap: var(--s-spacing)
}

.SidebarBP__share-links {
    display: flex;
    gap: 1rem
}

.SidebarBP__share-link {
    position: relative;
    transition: all .2s ease-in-out
}

.SidebarBP__share-link:after {
    bottom: -10px;
    content: "";
    left: -10px;
    position: absolute;
    right: -10px;
    top: -10px
}

.SidebarBP__share-link:hover {
    filter: brightness(2)
}

.SidebarBP__icon {
    -o-object-fit: contain;
    object-fit: contain
}

.SidebarBP__copy {
    cursor: pointer;
    position: relative;
    transition: opacity .2s ease
}

.SidebarBP__copy:before {
    background: var(--colour-purple-dark);
    border-radius: 2rem;
    color: var(--colour-white);
    content: "Link copied!";
    font-size: 14px;
    left: 0;
    letter-spacing: .024em;
    line-height: 140%;
    opacity: 0;
    padding: 2px 4px;
    pointer-events: none;
    position: absolute;
    text-align: center;
    top: -2.25rem;
    transform: translate(-38px, 20px);
    transition: all .32s cubic-bezier(.175, .885, .32, 1.275);
    width: 100px;
    z-index: 1
}

.SidebarBP__copy:hover img {
    opacity: .8
}

.SidebarBP__copy--copied {
    cursor: default
}

.SidebarBP__copy--copied:before {
    opacity: 1;
    pointer-events: all;
    transform: translate(-38px);
    visibility: visible
}

.Calc__container {
    border-radius: var(--m-spacing);
    display: flex;
    flex-direction: column;
    gap: var(--l-spacing);
    padding: var(--l-spacing)
}

.Calc__container--not-gated {
    padding-left: 0
}

.Calc__header {
    align-items: last baseline;
    display: flex;
    gap: var(--l-spacing)
}

.Calc__header--not-gated {
    margin-left: var(--l-spacing);
    margin-right: var(--l-spacing)
}

.Calc__header h1 {
    font-size: var(--font-size-h3) !important;
    line-height: var(--line-height-h3) !important
}

.Calc__header>* {
    flex: 1
}

.Calc .SmallDivider--not-gated {
    margin-left: var(--l-spacing);
    width: calc(100% - var(--l-spacing))
}

.Calc__main-content-wrapper {
    overflow-x: clip;
    position: relative
}

.Calc__main-content-wrapper--gated {
    overflow-x: visible;
    overflow-x: initial
}

.Calc__gate-form-wrapper {
    -webkit-backdrop-filter: blur(17px);
    backdrop-filter: blur(17px);
    background: rgba(0, 0, 0, .15);
    border-radius: var(--m-spacing);
    bottom: calc(var(--s-spacing)*-1);
    left: calc(var(--s-spacing)*-1);
    position: absolute;
    right: calc(var(--s-spacing)*-1);
    top: calc(var(--s-spacing)*-1);
    transition: all .4s ease-out, opacity .4s ease-out .2s;
    z-index: 5
}

.Calc__gate-form-wrapper--hidden {
    -webkit-backdrop-filter: blur(0);
    backdrop-filter: blur(0);
    background: transparent;
    opacity: 0;
    pointer-events: none
}

.Calc__gate-form {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 10
}

.Calc__gate-form .h3 {
    font-size: var(--font-size-h6) !important;
    line-height: var(--line-height-h6) !important
}

.Calc__sub-heading {
    margin-bottom: var(--m-spacing);
    position: relative;
    transition: transform .6s ease-out
}

.Calc__sub-heading--not-gated {
    align-items: center;
    display: flex;
    margin-left: var(--l-spacing);
    margin-right: var(--l-spacing)
}

.Calc__sub-heading--transformed {
    transform: translateX(-54%)
}

.Calc__sub-heading h2 {
    font-size: var(--font-size-h5) !important;
    line-height: var(--line-height-h5) !important
}

.Calc__sub-heading .heading {
    position: absolute;
    transition: all .3s ease-out
}

.Calc__sub-heading .heading--hidden {
    opacity: 0
}

.Calc__sub-heading .go-back {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--m-spacing);
    margin-left: 54%;
    transition: all .3s ease-out
}

.Calc__sub-heading .go-back,
.Calc__sub-heading .go-back h2 {
    width: -moz-max-content;
    width: max-content
}

.Calc__sub-heading .go-back--hidden {
    opacity: 0;
    pointer-events: none
}

.Calc__main-content {
    display: flex;
    overflow: visible;
    overflow: initial;
    transition: transform .6s ease-out
}

.Calc__main-content--not-gated {
    overflow: clip;
    overflow-clip-margin: 2rem;
    width: 154%
}

.Calc__main-content--transformed {
    transform: translateX(-35.06%)
}

.Calc__sliders {
    display: flex;
    flex-direction: column;
    gap: var(--m-spacing);
    padding-right: var(--l-spacing);
    width: 54%
}

.Calc__sliders--not-gated {
    height: -moz-fit-content;
    height: fit-content;
    margin-bottom: 1rem;
    padding-left: var(--l-spacing);
    padding-right: 0;
    width: 35.06%
}

.Calc__slider label {
    font-size: var(--font-size-h6);
    font-weight: 500;
    line-height: var(--line-height-h6)
}

.Calc__range {
    padding: calc(var(--m-spacing)/2) 0 var(--s-spacing) 0;
    position: relative
}

.Calc__range span {
    bottom: -5px;
    position: absolute
}

.Calc__range .Calc__value-label {
    align-items: center;
    background: var(--colour-white);
    border-radius: 10px;
    bottom: calc(var(--m-spacing)/2*-1);
    color: var(--module-accent-colour-2);
    display: inline-flex;
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h6);
    font-weight: var(--font-weight-semibold);
    justify-content: center;
    left: calc(var(--m-spacing)/2 + var(--ratio)*(100% - var(--m-spacing)));
    line-height: 1;
    padding: calc(var(--s-spacing)/3) calc(var(--s-spacing)/2);
    right: auto;
    transform: translate(-50%);
    width: -moz-max-content;
    width: max-content;
    z-index: 1
}

.Calc__range span:last-child {
    right: 0
}

.Calc__range input[type=range] {
    -webkit-appearance: none;
    background: var(--module-background-colour);
    border-radius: var(--l-spacing);
    width: 100%;
    --range: calc(var(--max) - var(--min));
    --ratio: calc((var(--value) - var(--min))/var(--range));
    --sx: calc(var(--m-spacing)/2 + var(--ratio)*(100% - var(--m-spacing)))
}

.Calc__range input[type=range]:focus {
    outline: none
}

.Calc__range input[type=range]::-webkit-slider-runnable-track {
    background: linear-gradient(var(--module-accent-colour), var(--module-accent-colour)) 0/var(--sx) 100% no-repeat, rgba(0, 0, 0, .15);
    border: none;
    border-radius: var(--l-spacing);
    cursor: pointer;
    height: calc(var(--m-spacing)/2);
    width: 100%
}

.Calc__range input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    background: var(--module-accent-colour-2);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    height: var(--m-spacing);
    margin-top: calc(var(--m-spacing)/2/2*-1);
    position: relative;
    width: var(--m-spacing)
}

.Calc__range input[type=range]::-webkit-slider-thumb:after {
    background: var(--colour-black);
    border-radius: 50%;
    content: "";
    height: 10px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 10px
}

.Calc__range input[type=range]::-moz-range-track {
    background: linear-gradient(var(--module-accent-colour), var(--module-accent-colour)) 0/var(--sx) 100% no-repeat, rgba(0, 0, 0, .15);
    border: none;
    border-radius: var(--l-spacing);
    cursor: pointer;
    height: calc(var(--m-spacing)/2);
    width: 100%
}

.Calc__range input[type=range]::-moz-range-thumb {
    background: var(--module-accent-colour-2);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    height: var(--m-spacing);
    width: var(--m-spacing)
}

.Calc__range input[type=range]::-ms-track {
    background-color: var(--module-background-colour);
    background: rgba(0, 0, 0, .15);
    border: none;
    border-radius: var(--l-spacing);
    color: transparent;
    cursor: pointer;
    height: calc(var(--m-spacing)/2);
    width: 100%
}

.Calc__range input[type=range]::-ms-fill-lower {
    background: var(--module-accent-colour)
}

.Calc__range input[type=range]::-ms-fill-upper {
    background: transparent
}

.Calc__range input[type=range]::-ms-thumb {
    background: var(--module-accent-colour-2);
    border-radius: 50%;
    cursor: pointer;
    height: var(--m-spacing);
    width: var(--m-spacing)
}

.Calc__results-wrapper {
    width: 46%
}

.Calc__results-wrapper--not-gated {
    padding-left: var(--l-spacing)
}

.Calc__results-wrapper--not-gated--desktop {
    width: 29.87%
}

.Calc__results-wrapper--not-gated--mobile {
    display: none;
    padding-right: var(--l-spacing);
    width: 100%
}

.Calc__results {
    background: var(--module-accent-colour-2);
    border-radius: var(--s-spacing);
    display: flex;
    flex-direction: column;
    gap: var(--m-spacing);
    height: -moz-fit-content;
    height: fit-content;
    padding: var(--m-spacing)
}

.Calc__results :not(.Calc__results-cta *):not(.Calc__calc-result) {
    color: var(--colour-white)
}

.Calc__results-heading h3 {
    font-size: var(--font-size-h6) !important;
    line-height: var(--line-height-h6) !important
}

.Calc__calculation {
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h2);
    font-weight: var(--font-weight-semibold)
}

.Calc__calculation--error {
    border: 2px solid var(--colour-error);
    border-radius: 5px;
    padding: .5rem;
    position: relative
}

.Calc__calculation--error:after {
    align-items: center;
    background: var(--colour-error);
    border-radius: 0 2px 2px 0;
    bottom: 0;
    color: var(--colour-white);
    content: "Error";
    display: flex;
    font-size: 1rem;
    font-weight: 700;
    padding: .5rem;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1
}

.Calc__calculation .Calc__calculation-error-message {
    display: none
}

.Calc__calculation .Calc__calculation-error-message--active {
    color: var(--colour-error) !important;
    display: block;
    font-family: var(--font-family-body);
    font-size: 14px;
    font-weight: 500;
    left: 2px;
    line-height: 1;
    position: absolute;
    top: -18px;
    transform-origin: bottom
}

.Calc__calculation--highlight {
    font-size: var(--font-size-h1)
}

.Calc__calculation--highlight--lavender {
    color: var(--colour-lavender) !important
}

.Calc__calculation--highlight--orange {
    color: var(--colour-orange) !important
}

.Calc__calculation--highlight--green {
    color: var(--colour-green) !important
}

.Calc__calc-label {
    display: inline-flex;
    font-family: var(--font-family-body);
    font-size: var(--font-size-h6);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-h6)
}

.Calc__results-cta {
    align-items: center;
    background: var(--colour-white);
    border-radius: calc(var(--m-spacing)/2);
    display: flex;
    flex-wrap: wrap;
    gap: calc(var(--m-spacing)/2);
    height: auto;
    margin: 0 calc(var(--m-spacing)/2*-1) calc(var(--m-spacing)/2*-1) calc(var(--m-spacing)/2*-1);
    opacity: 1;
    padding: var(--s-spacing) var(--m-spacing);
    transition: all .4s ease-out, opacity .6s ease-out;
    width: calc(100% + var(--m-spacing))
}

.Calc__results-cta--hidden {
    height: 0;
    opacity: 0;
    padding: 0
}

.Calc__results-cta--hidden * {
    display: none !important
}

.Calc__results-cta h4 {
    font-size: var(--font-size-h6) !important;
    line-height: var(--line-height-h6) !important
}

.Calc__results-cta a {
    width: -moz-max-content;
    width: max-content
}

.Calc__get-results-form {
    padding-left: var(--s-spacing);
    width: 35.06%
}

.Calc__get-results-form .h3 {
    font-size: var(--font-size-h6) !important;
    line-height: var(--line-height-h6) !important
}

.Calc__debug-data--not-gated {
    margin-left: var(--l-spacing)
}

.Calc__debug-data pre {
    max-height: 350px;
    overflow-y: scroll
}

.Calc .cta-button,
.Calc .go-back-button {
    align-items: center;
    border: 2px solid;
    border-radius: 100px;
    color: var(--button-colour);
    cursor: pointer;
    display: inline-flex;
    font-family: var(--font-family-link);
    font-size: var(--font-size-s);
    font-weight: var(--font-weight-bold);
    gap: 13px;
    line-height: 1.15;
    padding: 10px 22px 10px 18px;
    position: relative;
    text-wrap: nowrap;
    transition: all .3s ease-in-out, scale none;
    z-index: 1
}

.Calc .cta-button:active,
.Calc .go-back-button:active {
    scale: .98
}

.Calc .cta-button svg,
.Calc .go-back-button svg {
    transition: all .3s ease-in-out;
    z-index: 1
}

.Calc .cta-button svg path,
.Calc .go-back-button svg path {
    transition: stroke .3s ease-in-out
}

.Calc .cta-button:after,
.Calc .go-back-button:after {
    background: var(--colour-purple-dark);
    border-radius: 100px;
    content: "";
    height: calc(100% + 4px);
    left: -2px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    top: -2px;
    transition: all .35s ease-in-out;
    width: 44px;
    z-index: -1
}

.Calc .cta-button--lavender,
.Calc .go-back-button--lavender {
    background: var(--colour-lavender);
    border-color: var(--colour-lavender)
}

.Calc .cta-button--lavender:before,
.Calc .go-back-button--lavender:before {
    background: var(--colour-lavender)
}

.Calc .cta-button--orange,
.Calc .go-back-button--orange {
    background: var(--colour-orange);
    border-color: var(--colour-orange)
}

.Calc .cta-button--orange:before,
.Calc .go-back-button--orange:before {
    background: var(--colour-orange)
}

.Calc .cta-button--green,
.Calc .go-back-button--green {
    background: var(--colour-green);
    border-color: var(--colour-green)
}

.Calc .cta-button--green:before,
.Calc .go-back-button--green:before {
    background: var(--colour-green)
}

.Calc .cta-button--white-go-back,
.Calc .go-back-button--white-go-back {
    background: var(--colour-white);
    border-color: var(--colour-purple-dark)
}

.Calc .cta-button--white-go-back svg,
.Calc .go-back-button--white-go-back svg {
    transform: rotate(180deg)
}

.Calc .cta-button--white-go-back:before,
.Calc .go-back-button--white-go-back:before {
    background: var(--colour-white)
}

.Calc .cta-button--white-go-back:after,
.Calc .go-back-button--white-go-back:after {
    left: auto;
    right: -2px
}

.Calc .FormComponent__container {
    gap: calc(var(--m-spacing)/2);
    margin: calc(var(--s-spacing)/2);
    padding: calc(var(--m-spacing)/2)
}

.Calc .FormComponent form.hs-form>*+*,
.Calc .FormComponent form.hs-form>fieldset+fieldset {
    margin: 1rem 0 0
}

.Calc .FormComponent form input,
.Calc .FormComponent form select {
    height: 40px
}

.Cards .row--no-top-padding {
    padding-top: calc(var(--xl-spacing)/2)
}

.Cards .row--no-bottom-padding {
    padding-bottom: calc(var(--xl-spacing)/2)
}

.Cards.Cards--medium-gap .row--no-top-padding {
    padding-top: calc(var(--m-spacing)/2)
}

.Cards.Cards--medium-gap .row--no-bottom-padding {
    padding-bottom: calc(var(--m-spacing)/2)
}

.CaseStudyTab--logos,
.CaseStudyTab__logo {
    align-items: center;
    display: flex;
    width: 100%
}

.CaseStudyTab__logo {
    border-radius: 1rem;
    cursor: pointer;
    flex: 1 1 auto;
    height: 88px;
    justify-content: center;
    padding: .5rem;
    position: relative;
    transition: all .32s ease
}

.CaseStudyTab__logo img {
    filter: grayscale(1);
    height: 40px;
    -o-object-fit: contain;
    object-fit: contain;
    opacity: .5;
    transition: all .64s cubic-bezier(.175, .885, .32, 1.275);
    width: 80%
}

.CaseStudyTab__logo:hover img {
    opacity: .8;
    transform: translateY(-.25rem)
}

.CaseStudyTab__logo.active {
    background: var(--accent-light);
    cursor: default;
    scale: 1 !important
}

.CaseStudyTab__logo.active img {
    filter: none;
    opacity: 1 !important
}

.CaseStudyTab__logo.active:hover img {
    opacity: 1;
    transform: none
}

.CaseStudyTabItem {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    visibility: hidden
}

.CaseStudyTabItem.active {
    animation: fadeIn 1.5s cubic-bezier(.175, .885, .32, 1.04) forwards;
    display: grid;
    pointer-events: all;
    position: relative;
    visibility: visible;
    grid-gap: 1rem;
    gap: 1rem;
    opacity: 1
}

@keyframes fadeIn {
    0% {
        opacity: 0;
        transform: translateY(1rem)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.CaseStudyTabItem.active .CaseStudyTabItem__quote-text {
    animation: fadeIn 1s cubic-bezier(.175, .885, .32, 1.04) forwards;
    opacity: 0
}

.CaseStudyTabItem.active .CaseStudyTabItem__quote-cite {
    animation: fadeIn 1.25s cubic-bezier(.175, .885, .32, 1.04) .4s forwards;
    opacity: 0
}

.CaseStudyTabItem.active .CaseStudyTabItem__media {
    animation: fadeIn 1.5s cubic-bezier(.175, .885, .32, 1.04) .6s forwards;
    opacity: 0
}

.CaseStudyTabItem--top {
    display: grid;
    flex-wrap: wrap;
    justify-content: space-between;
    grid-gap: 1.5rem;
    align-items: center;
    gap: 1.5rem;
    margin: 0 0 1rem
}

.CaseStudyTabItem--bottom,
.CaseStudyTabItem__quote {
    background: var(--accent-light);
    border-radius: 1rem;
    padding: 2rem
}

.CaseStudyTabItem--bottom .Button--dark a {
    border-color: var(--colour-purple-dark) !important
}

.CaseStudyTabItem__quote {
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

.CaseStudyTabItem__quote * {
    color: var(--colour-purple-dark)
}

.CaseStudyTabItem__quote-text {
    max-width: 680px
}

.CaseStudyTabItem__quote-author {
    font-weight: var(--font-weight-bold)
}

.CaseStudyTabItem--middle-grid {
    display: grid;
    grid-gap: 1rem;
    gap: 1rem
}

.CaseStudyTabItem__media {
    aspect-ratio: 16/9;
    border-radius: 1rem;
    height: 100%;
    overflow: hidden;
    width: 100%
}

.CaseStudyTabItem__media .wistia_embed,
.CaseStudyTabItem__media .wistia_embed>div {
    aspect-ratio: 16/9 !important;
    height: 100% !important;
    width: 100% !important
}

.CaseStudyTabItem__media img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%
}

.CaseStudyTabItem--bottom {
    display: grid;
    grid-gap: 2rem;
    gap: 2rem
}

.CaseStudyTabItem__solution-title {
    color: var(--colour-purple-dark);
    font-family: var(--font-family-heading);
    font-size: 12px;
    font-weight: var(--font-weight-bold);
    letter-spacing: .075em;
    margin: 0 0 1rem;
    text-transform: uppercase
}

.CaseStudyTabItem--stats {
    display: grid;
    grid-gap: 2rem;
    gap: 2rem
}

.CaseStudyTabItem .StatsItem {
    overflow: hidden
}

.CaseStudyTabItem .StatsItem__border {
    background: var(--accent);
    border-radius: 1rem;
    display: block;
    height: auto;
    overflow: hidden;
    width: 5px
}

.CaseStudyTabItem .StatsItem__wrapper {
    display: grid;
    grid-gap: 1rem;
    gap: 1rem
}

.CaseStudyTab__progress {
    border-radius: 2rem;
    height: 8px;
    margin: 1rem 0 3rem;
    overflow: clip;
    transition: all .2s ease;
    width: 100%
}

.CaseStudyTab__progress-bar {
    background: var(--colour-purple-dark);
    border-radius: 2rem;
    bottom: -1rem;
    height: 8px;
    left: 0;
    position: absolute;
    transform: translateY(100%);
    transform-origin: right;
    width: 0
}

.bg-colour-dark .CaseStudyTab__logo {
    background: var(--accent-light);
    scale: .7;
    transition: all .32s ease
}

.bg-colour-dark .CaseStudyTab__logo img {
    filter: none;
    opacity: .8
}

.bg-colour-dark .CaseStudyTab__logo:hover {
    scale: .73;
    transition: all .32s ease, scale .1s ease
}

.bg-colour-dark .CaseStudyTab__logo:hover img {
    transform: none
}

.bg-colour-dark .CaseStudyTab__progress-bar {
    background: var(--accent)
}

.CTAStrip--container {
    align-items: center;
    background: var(--card-background);
    border-radius: 20px;
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    justify-content: space-between;
    padding: 1.5rem
}

.CTAStrip__text * {
    color: var(--colour-white)
}

.Footer {
    --intro-width: 320px;
    --menu-spacing: 1.5rem;
    background: var(--colour-lavender-light);
    padding-top: 3.5rem
}

.Footer--landing {
    padding-top: 3rem
}

.Footer--landing .Footer__logo {
    justify-content: center;
    margin-bottom: 3rem
}

.Footer__logo {
    display: flex
}

.Footer__logo a {
    transition: all .1s ease-in-out
}

.Footer__logo a:hover {
    filter: brightness(.9);
    opacity: 1
}

.Footer__logo img {
    height: 40px;
    -o-object-fit: contain;
    object-fit: contain;
    width: auto
}

.Footer--middle {
    display: grid;
    padding: 4rem 0;
    grid-gap: 2rem;
    gap: 2rem
}

.Footer--intro {
    justify-content: space-between
}

.Footer--intro,
.Footer--top-intro {
    display: flex;
    flex-direction: column;
    gap: var(--m-spacing)
}

.Footer--menus {
    display: grid;
    grid-gap: 3rem var(--menu-spacing);
    gap: 3rem var(--menu-spacing);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 100%
}

.FooterMenu__title {
    color: var(--colour-purple-dark);
    font-size: var(--font-size-h6);
    font-weight: var(--font-weight-semibold);
    margin: 0 0 1.5rem
}

.FooterMenu__menu ul {
    list-style: none;
    padding: 0
}

.FooterMenu__menu ul li {
    display: block
}

.FooterMenu__menu ul>*+* {
    margin: .25rem 0 0
}

.FooterMenu__menu a {
    color: var(--colour-purple-dark);
    display: inline-block;
    font-size: 14px
}

.Footer--bottom {
    --border-height: 5px;
    background: var(--colour-purple-dark);
    padding: calc(1rem + var(--border-height)) 0 1rem;
    position: relative
}

.Footer--bottom:before {
    background: var(--colour-gradient-line);
    content: "";
    height: var(--border-height);
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.Footer--legal {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 2rem;
    justify-content: space-between
}

.Footer--legal * {
    color: var(--colour-white);
    font-size: 13px
}

.FeatureTabs--grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 2rem 0 0;
    grid-gap: 2rem;
    gap: 2rem
}

.FeatureTabs--grid.flip .FeatureTabs--col {
    order: 2
}

.FeatureTabs--grid.flip .FeatureTabs__image {
    order: 1
}

.FeatureTabs--col>*+* {
    margin: 1rem 0 0
}

.FeatureTabsItem {
    background: none;
    border-radius: 12px;
    padding: 2rem
}

.FeatureTabsItem--active {
    background: var(--accent-light);
    transition: background-color .32s ease-in-out
}

.FeatureTabsItem--active .FeatureTabsItem__title {
    cursor: default
}

.FeatureTabsItem--active .FeatureTabsItem__title:before {
    display: none
}

.FeatureTabsItem--active .FeatureTabsItem__chevron {
    transform: rotate(180deg)
}

.FeatureTabsItem--active .FeatureTabsItem__text {
    display: flex;
    flex-direction: column
}

.FeatureTabsItem--active .FeatureTabsItem__timer {
    height: 6px;
    margin: 2rem 0 0
}

.FeatureTabsItem__title {
    align-items: center;
    color: var(--colour-purple-dark);
    cursor: pointer;
    display: flex;
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h6);
    font-weight: var(--font-weight-bold);
    justify-content: space-between;
    position: relative
}

.FeatureTabsItem__title:before {
    background: var(--accent-light);
    border-radius: 12px;
    content: "";
    height: calc(100% + 4rem);
    left: 50%;
    opacity: 0;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: opacity .32s ease-in-out;
    width: calc(100% + 4rem);
    z-index: -1
}

.FeatureTabsItem__title:hover:before {
    opacity: 1
}

.FeatureTabsItem__chevron {
    background-color: var(--accent);
    background-image: var(--chevron-icon);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 50%;
    border-radius: 100%;
    display: inline-block;
    flex: 0 0 auto;
    height: 1.75rem;
    transform: rotate(0deg);
    transition: transform .32s ease-in-out;
    width: 1.75rem
}

.FeatureTabsItem__text {
    display: none;
    padding: 1rem 0 0
}

.FeatureTabsItem__button {
    margin: 2rem 0 0
}

.FeatureTabsItem__timer {
    background: rgba(0, 0, 0, .075);
    border-radius: 8px;
    height: 0;
    margin: 0;
    overflow: hidden;
    width: 100%
}

.FeatureTabsItem__timer.hide-timer {
    display: none
}

.FeatureTabsItem__timer--bar {
    background: var(--accent);
    height: 6px;
    width: 0
}

.FeatureTabs__image {
    border-radius: 12px;
    display: none;
    height: auto;
    overflow: hidden;
    width: 100%
}

.FeatureTabs__image--active {
    animation: fadeImage .5s ease-in-out;
    display: block
}

.FeatureTabs__image img {
    aspect-ratio: 16/10;
    height: auto;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%
}

.FilterInsights .Card {
    opacity: 0;
    transition: opacity .3s ease
}

.FilterInsights .Card--visible {
    opacity: 1
}

.FilterInsights__filters {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    justify-content: space-between;
    margin-bottom: 2rem
}

.FilterInsights__filters .HubFiltersMenu__select {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-color: var(--colour-white);
    background-image: var(--icon-select-arrows);
    background-position: right 10px center;
    background-repeat: no-repeat;
    background-size: 12px;
    border: 1px solid rgba(0, 0, 0, .25);
    border-radius: 5px;
    color: var(--colour-heading);
    font-size: var(--font-size-base);
    max-width: 100%;
    padding: 10px;
    width: 100%
}

.FilterInsights__label {
    display: inline-block;
    font-size: var(--font-size-small);
    font-weight: var(--font-weight-semibold);
    margin-bottom: 8px
}

.FilterInsights__menu {
    max-width: 100%
}

.FilterInsights__UI {
    display: grid;
    grid-gap: 2rem;
    gap: 2rem
}

.Hub--release-notes .HubHero {
    align-items: flex-end;
    display: flex;
    flex-wrap: wrap;
    gap: var(--m-spacing);
    justify-content: space-between;
    margin-bottom: var(--vertical-spacing)
}

.Hub--release-notes .HubHero__title {
    width: -moz-max-content;
    width: max-content
}

.Hub--release-notes .HubHeader__search {
    flex: 1;
    margin: 0 !important;
    min-width: 300px
}

.Hub--release-notes .HubHeader__search-icon {
    background: var(--colour-lavender)
}

.Hub--release-notes .HubFilters__menus {
    margin: var(--filter-padding);
    max-height: 100%;
    overflow-y: scroll;
    padding: 0 .5rem 0 0
}

.Hub--release-notes .HubFilters__menus::-webkit-scrollbar {
    display: block !important;
    width: 8px
}

.Hub--release-notes .HubFilters__menus::-webkit-scrollbar-thumb {
    background: var(--colour-lavender);
    border-radius: 9px
}

.Hub--release-notes .HubFilters__menus::-webkit-scrollbar-track {
    background: rgba(48, 27, 93, .1);
    border-radius: 9px
}

.Hub--release-notes .HubFiltersMenu__item {
    color: #171535;
    cursor: pointer;
    opacity: 1;
    transition: all .15s ease
}

.Hub--release-notes .HubFiltersMenu__item:hover {
    opacity: .8
}

.Hub--release-notes .HubFiltersMenu__item--active {
    color: #6947ff;
    font-weight: var(--font-weight-semibold)
}

.Hub--release-notes .HubGrid__title {
    color: var(--colour-purple-dark);
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h3);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-h3);
    margin-bottom: var(--s-spacing)
}

.Hub--release-notes .HubGrid__inner-container {
    display: flex;
    flex-direction: column;
    gap: var(--s-spacing);
    width: 100%
}

.Hub--release-notes .HubGrid .ReleaseCard {
    background: var(--colour-lavender-light);
    border-radius: var(--border-radius);
    color: var(--colour-heading) !important;
    padding: var(--s-spacing);
    transition: all .32s ease
}

.Hub--release-notes .HubGrid .ReleaseCard:hover {
    transform: translateY(-5px)
}

.Hub--release-notes .HubGrid .ReleaseCard:hover .ReleaseCard__cta:after {
    transform: translateX(5px)
}

.Hub--release-notes .HubGrid .ReleaseCard * {
    color: var(--colour-purple-dark) !important;
    font-family: var(--font-family-body) !important;
    font-weight: 500 !important
}

.Hub--release-notes .HubGrid .ReleaseCard article {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--s-spacing);
    justify-content: space-between
}

.Hub--release-notes .HubGrid .ReleaseCard__left {
    display: flex;
    flex-direction: column;
    gap: calc(var(--s-spacing)/2)
}

.Hub--release-notes .HubGrid .ReleaseCard__title {
    font-family: var(--font-family-heading) !important;
    font-size: var(--font-size-h4) !important;
    font-weight: var(--font-weight-semibold) !important;
    line-height: var(--line-height-h4) !important
}

.Hub--release-notes .HubGrid .ReleaseCard__cta {
    position: relative
}

.Hub--release-notes .HubGrid .ReleaseCard__cta:after {
    background: var(--icon-arrow);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100%;
    content: "";
    display: inline-block;
    height: 15px;
    margin-left: .5rem;
    transition: all .32s ease;
    width: 15px
}

.Hub--release-notes .HubGrid .ReleaseCard__date {
    background: var(--colour-purple-dark);
    border-radius: 50px;
    color: var(--colour-white) !important;
    font-size: 1.06em;
    margin-left: .5rem;
    padding: 4px 10px
}

.HubHeader {
    padding: calc(var(--combined-nav-height) + var(--vertical-spacing)) 0 1rem
}

.HubHeader--container {
    background: linear-gradient(var(--colour-lavender-light), var(--colour-white))
}

.HubHeader__title {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    justify-content: space-between
}

.HubHeader__title h1 {
    color: var(--colour-purple-dark);
    font-size: var(--font-size-xxl)
}

.HubHeader__search {
    --input-height: 42px;
    align-items: center;
    display: grid;
    grid-template-columns: 1fr var(--input-height);
    height: var(--input-height);
    max-width: 480px;
    width: 100%
}

.HubHeader__search input {
    border: 1px solid var(--colour-grey-light);
    border-radius: .25rem 0 0 .25rem;
    border-right: none;
    font-size: var(--font-size-p);
    height: var(--input-height);
    line-height: 100%;
    padding: .2rem .75rem;
    width: 100%
}

.HubHeader__search input::-webkit-search-cancel-button {
    -webkit-appearance: none;
    appearance: none
}

.HubHeader__search-icon {
    background: var(--colour-green);
    border: 1px solid var(--colour-grey-light);
    border-radius: 0 .25rem .25rem 0;
    height: var(--input-height);
    padding: .5rem;
    width: var(--input-height)
}

.HubHeader__search-icon img {
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
    width: 100%
}

.HubHeader__quick-filter {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    justify-content: center;
    margin-top: 2rem;
    max-width: 100%
}

.HubHeader__quick-link {
    background: none;
    border: 2px solid var(--colour-purple-dark);
    border-radius: 2rem;
    color: var(--colour-purple-dark);
    cursor: pointer;
    font-family: var(--font-family-body);
    font-weight: var(--font-weight-semibold);
    line-height: 150%;
    padding: 2px 8px;
    position: relative;
    transition: all .32s ease
}

.HubHeader__quick-link:after {
    background: var(--colour-lavender);
    border-radius: 100px;
    content: "";
    height: calc(100% + 4px);
    left: -2px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    top: -2px;
    transition: all .35s ease-in-out;
    width: 44px;
    z-index: -1
}

.HubHeader__quick-link--active {
    background: var(--colour-purple-dark);
    border-color: var(--colour-purple-dark);
    color: var(--colour-white);
    cursor: default
}

.HubFilters {
    background: var(--colour-lavender-light);
    border-radius: .75rem;
    overflow: clip;
    padding-bottom: .5rem;
    --filter-padding: 1rem
}

.HubFilters .HubFilters__menus,
.HubFilters .HubFilters__sorting {
    display: none
}

.HubFilters--open .HubFilters__sorting {
    display: flex
}

.HubFilters--open .HubFilters__menus {
    display: block
}

.HubFilters--open .HubFilters__toggle {
    transform: rotate(0deg)
}

.HubFilters__toggle {
    aspect-ratio: 1/1;
    background: var(--colour-lavender-light);
    background-image: var(--chevron-icon);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 60%;
    border: 0;
    border-radius: 100%;
    cursor: pointer;
    height: 1.5rem;
    outline: none;
    transform: rotate(180deg);
    transition: all .32s ease;
    width: 1.5rem
}

.HubFilters__toggle:hover {
    opacity: .8
}

.HubFilters__header {
    padding: var(--filter-padding)
}

.HubFilters__title {
    align-items: center;
    cursor: pointer;
    display: flex;
    font-size: var(--font-size-s);
    font-weight: var(--font-weight-semibold);
    gap: .5rem
}

.HubFilters__menus *,
.HubFilters__sorting *,
.HubFilters__title {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.HubFilters__menus *,
.HubFilters__sorting * {
    color: var(--colour-purple-dark)
}

.HubFilters__sorting {
    align-items: center;
    background: hsla(0, 0%, 100%, .4);
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding: .5rem var(--filter-padding)
}

.HubFilters__sorting-select,
.HubFilters__sorting-title {
    font-size: var(--font-size-s);
    font-weight: var(--font-weight-semibold)
}

.HubFilters__sorting-select {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-color: var(--colour-purple-dark);
    background-image: var(--chevron-select-icon);
    background-position: right 1rem top 50%, 0 0;
    background-repeat: no-repeat, repeat;
    background-size: .75rem auto, 100%;
    border: 1px solid var(--colour-purple-dark);
    border-radius: 2rem;
    color: var(--colour-white);
    max-width: 100%;
    padding: .25rem 2.5rem .25rem 1rem;
    position: relative;
    width: auto
}

.HubFilters__sorting-select option {
    color: var(--colour-white)
}

.HubFilters__sorting-select:focus-visible {
    border: 1px solid var(--colour-purple-dark);
    outline: none
}

.HubFilters__header {
    align-items: center;
    background: var(--colour-purple-dark);
    color: var(--colour-white);
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: space-between
}

.HubFiltersMenu {
    padding: .5rem var(--filter-padding)
}

.HubFiltersMenu__items {
    display: none;
    list-style: none;
    padding-top: .75rem !important
}

.HubFiltersMenu__items input[type=checkbox] {
    cursor: pointer;
    height: 0;
    opacity: 0;
    position: absolute;
    width: 0
}

.HubFiltersMenu__items input[type=checkbox]+label {
    align-items: center;
    color: var(--colour-purple-dark);
    cursor: pointer;
    display: flex;
    font-size: var(--font-size-s);
    gap: .5rem;
    padding-left: 1.5rem;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.HubFiltersMenu__items input[type=checkbox]:checked+label {
    font-weight: var(--font-weight-semibold)
}

.HubFiltersMenu__items input[type=checkbox]+label:before {
    background: var(--colour-white);
    border: 1px solid var(--colour-purple-dark);
    border-radius: .25rem;
    content: "";
    height: 1.25rem;
    left: 0;
    position: absolute;
    top: 4px;
    width: 1.25rem
}

.HubFiltersMenu__items input[type=checkbox]:checked+label:before {
    background: var(--colour-purple-dark);
    border: 1px solid var(--colour-purple-dark)
}

.HubFiltersMenu__items input[type=checkbox]+label:after {
    content: "";
    display: none;
    position: absolute
}

.HubFiltersMenu__items input[type=checkbox]:checked+label:after {
    display: block
}

.HubFiltersMenu__items input[type=checkbox]+label:after {
    border: solid var(--colour-white);
    border-width: 0 2px 2px 0;
    height: .75rem;
    left: .5rem;
    top: 6px;
    transform: rotate(45deg);
    width: .5rem
}

.HubFiltersMenu__items input[type=checkbox]:checked+label:after {
    border: solid var(--colour-white);
    border-width: 0 2px 2px 0;
    height: .75rem;
    left: .45rem;
    top: 6px;
    transform: rotate(45deg);
    width: .4rem
}

.HubFiltersMenu--active {
    background: hsla(0, 0%, 100%, .4)
}

.HubFiltersMenu--active .HubFiltersMenu__items {
    display: block
}

.HubFiltersMenu--active .HubFiltersMenu__title:hover {
    opacity: 1
}

.HubFiltersMenu--active .HubFiltersMenu__title:after {
    transform: none
}

.HubFiltersMenu--content-type .HubFiltersMenu__items input[type=checkbox]+label:before {
    border-radius: 100%
}

.HubFiltersMenu--content-type .HubFiltersMenu__items input[type=checkbox]:checked+label:before {
    background: var(--colour-white);
    border: 1px solid var(--colour-purple-dark)
}

.HubFiltersMenu--content-type .HubFiltersMenu__items input[type=checkbox]+label:after {
    background: var(--colour-purple-dark);
    border-width: 0;
    content: "";
    display: none;
    height: 14px;
    left: 3px;
    position: absolute;
    top: 7px;
    transform: rotate(0);
    width: 14px
}

.HubFiltersMenu--content-type .HubFiltersMenu__items input[type=checkbox]:checked+label:after {
    border-radius: 100%;
    border-width: 0;
    display: block;
    height: 14px;
    left: 3px;
    top: 7px;
    transform: rotate(0);
    width: 14px
}

.HubFiltersMenu__title {
    align-items: center;
    cursor: pointer;
    display: flex;
    font-size: var(--font-size-h6);
    font-weight: var(--font-weight-semibold);
    justify-content: space-between;
    transition: all .32s ease
}

.HubFiltersMenu__title:hover {
    opacity: .6
}

.HubFiltersMenu__title:after {
    background: var(--chevron-icon);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100%;
    content: "";
    height: 1rem;
    transform: rotate(180deg);
    width: 1rem
}

.HubFilters__reset {
    background: var(--colour-lavender-light);
    border: none;
    border-radius: 2rem;
    color: var(--colour-purple-dark);
    cursor: pointer;
    font-size: var(--font-size-s);
    font-weight: var(--font-weight-semibold);
    outline: none;
    padding: .25rem 1rem
}

.HubFilters__reset:hover {
    background: var(--colour-lavender);
    color: var(--colour-white)
}

.HubFeed {
    display: grid;
    padding-top: 2rem;
    grid-gap: 2rem;
    align-items: start;
    gap: 2rem
}

.HubGrid {
    gap: 3.5rem;
    overflow: visible;
    position: relative
}

.HubGrid__ui {
    background: #fff;
    border-top: 1px solid var(--colour-lavender-light);
    gap: 1rem;
    padding: 1rem 0;
    position: sticky;
    top: var(--nav-height);
    z-index: 2
}

.HubGrid__ui,
.HubPagination {
    align-items: center;
    display: flex;
    flex-wrap: wrap
}

.HubPagination {
    gap: .5rem
}

.HubPagination Button {
    background: var(--colour-lavender-light);
    border: none;
    border-radius: 4px;
    color: var(--colour-purple-dark);
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    font-weight: var(--font-weight-semibold);
    min-width: 32px;
    padding: 2px .75rem;
    transition: all .32s ease
}

.HubPagination Button:hover {
    background: var(--colour-lavender);
    color: var(--colour-white)
}

.HubPagination Button:disabled {
    cursor: default;
    opacity: .2
}

.HubPagination Button:disabled:hover {
    background: var(--colour-lavender-light);
    color: var(--colour-purple-dark)
}

.HubPagination Button:disabled.active {
    display: inline-block;
    opacity: 1
}

.HubPagination Button:disabled.active,
.HubPagination Button:disabled.active:hover {
    background: var(--colour-purple-dark);
    color: var(--colour-white)
}

.Hub__showing {
    color: var(--colour-purple-dark);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold)
}

.Hub .Card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    transition: all 1.25s cubic-bezier(.64, -.32, .24, 1.1)
}

.Hub .Card:hover .Card__title {
    color: var(--colour-lavender)
}

.Hub .Card:hover .Card__image img {
    transform: scale(1.1);
    z-index: 0
}

.Hub .Card__tag {
    background: var(--colour-lavender-light);
    border-radius: 1.25rem;
    color: var(--colour-purple-dark);
    font-size: 13px;
    font-weight: var(--font-weight-semibold);
    padding: 3px 10px;
    position: absolute;
    right: .75rem;
    top: .75rem;
    z-index: 1
}

.Hub .Card__image {
    border-radius: .75rem;
    overflow: hidden;
    position: relative
}

.Hub .Card__image img {
    aspect-ratio: 16/10;
    height: auto;
    position: relative;
    transition: transform 1.5s cubic-bezier(.24, .48, .44, 1.04);
    width: 100%;
    z-index: 0
}

.Hub .Card__text {
    padding: .25rem 0 0
}

.Hub .Card__date {
    color: var(--colour-purple-dark);
    display: inline-block;
    font-size: var(--font-size-s);
    font-weight: var(--font-weight-semibold);
    margin: 0 0 1.75rem
}

.Hub .Card__title {
    font-size: var(--font-size-base);
    margin: 0 0 .75rem;
    transition: color .32s ease
}

.Hub .Card__summary {
    color: var(--colour-paragraph);
    font-size: var(--font-size-base);
    line-height: 160%
}

.Hub .Card__button {
    margin: 1rem 0 0
}

.Hub .Card__button a {
    align-items: center;
    color: var(--colour-purple-dark);
    display: inline-block;
    display: flex;
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    gap: .5rem
}

.Hub .Card__button a:hover {
    opacity: 1
}

.Hub .Card__button a:after {
    --icon-size: 1.5rem;
    background: var(--arrow-icon);
    background-color: var(--colour-purple-dark);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 30%;
    border-radius: 100%;
    content: "";
    display: inline-block;
    flex: 0 0 var(--icon-size);
    height: var(--icon-size);
    transition: all .32s ease;
    width: var(--icon-size)
}

.Hub .Card__button a:before {
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1
}

.Hub .Card__button a:hover:after {
    background-color: var(--colour-lavender);
    transform: rotate(-45deg)
}

.Hub .Card__meta * {
    display: block;
    font-size: 12px;
    padding: .25rem
}

.Fetch-error {
    background: var(--colour-orange-light);
    border: 1px solid var(--colour-orange);
    border-radius: .5rem;
    color: var(--colour-purple-dark);
    font-family: var(--font-family-body);
    grid-column: span 3/span 3;
    line-height: 120%;
    max-width: 400px;
    padding: 1rem
}

.Hub-Debug {
    background: #fff;
    border-radius: .5rem;
    color: #000;
    display: flex;
    flex-direction: column;
    font-size: 11px;
    left: 1rem;
    line-height: 130%;
    max-height: calc(60vh - var(--combined-nav-height) - 2rem);
    opacity: .8;
    overflow-y: auto;
    padding: .5rem;
    position: fixed;
    top: calc(var(--combined-nav-height) + 1rem);
    width: 300px;
    z-index: 1000;
    word-wrap: anywhere;
    font-family: Inter;
    letter-spacing: .01em
}

.Hub-Debug>* {
    display: inline-block
}

.Hub-Debug>*+* {
    margin: .25rem 0 0
}

.Hub-Debug:hover {
    opacity: 1
}

.HubPrompts {
    margin: 3rem 0 1rem;
    width: 100%
}

.HubPrompts--hidden {
    height: 0;
    margin: 0;
    opacity: 0;
    pointer-events: none;
    transition: all .3s linear .1s, opacity .2s ease
}

.HubPrompts--row {
    display: grid;
    margin: 2rem 0 0;
    grid-gap: .5rem;
    gap: .5rem;
    grid-template-columns: repeat(2, minmax(0, 1fr))
}

.HubPrompts__title {
    color: var(--colour-purple-dark);
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h5);
    font-weight: var(--font-weight-semibold)
}

.HubPromptsItem {
    background: var(--colour-white);
    border: 1px solid var(--colour-lavender-light);
    border-radius: 10px;
    color: var(--colour-purple-dark);
    padding: 1rem;
    transition: all .64s cubic-bezier(.175, .885, .32, 1.04)
}

.HubPromptsItem__title {
    color: var(--colour-purple-dark);
    font-size: var(--font-size-s)
}

.HubPromptsItem__icon {
    margin-bottom: .5rem
}

.HubPromptsItem__icon svg {
    height: 1.5rem;
    -o-object-fit: contain;
    object-fit: contain;
    width: 1.5rem
}

.HubPromptsItem__icon svg * {
    fill: var(--colour-purple-dark)
}

.ImageCta.module {
    background: none
}

.ImageCta--container {
    position: relative
}

.ImageCta__bg-image {
    height: 100%;
    left: 50%;
    max-width: var(--wrapper);
    overflow: hidden;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    z-index: 1
}

.ImageCta__bg-image img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%
}

.ImageCta__contents {
    background: var(--colour-white);
    border-radius: var(--border-radius);
    max-width: 580px;
    padding: var(--l-spacing)
}

.LogoCarousel .wrapper {
    max-width: 100vw;
    overflow: clip;
    padding: 0
}

.LogoCarousel .embla {
    width: 100vw
}

.LogoCarousel .embla__container {
    display: flex
}

.LogoCarousel .embla__slide {
    padding: 0 1rem
}

.LogoCarouselItem {
    --width: 280px;
    align-content: center;
    border: 1px solid var(--colour-grey-light);
    border-radius: 10px;
    display: grid;
    height: 100%;
    justify-content: center;
    min-height: 220px;
    overflow: hidden;
    padding: 1rem;
    place-content: center;
    transition: all .32s ease;
    width: var(--width)
}

.LogoCarouselItem__text {
    color: var(--colour-purple-dark);
    font-size: var(--font-size-s);
    line-height: 130%
}

.LogoCarouselItem--linked {
    opacity: 1;
    width: var(--width);
    grid-gap: .5rem;
    align-items: center;
    display: grid;
    gap: .5rem;
    transition: all .48s ease
}

.LogoCarouselItem--linked:hover {
    background: var(--accent-light, var(--colour-lavender-light));
    opacity: 1
}

.LogoCarouselItem--linked:hover img {
    filter: none;
    opacity: 1
}

.LogoCarouselItem__image {
    aspect-ratio: 16/6;
    height: 100%;
    width: 100%
}

.LogoCarouselItem__image img {
    filter: grayscale(1);
    height: auto;
    max-height: 40px;
    max-width: 120px;
    -o-object-fit: contain;
    object-fit: contain;
    opacity: .5;
    transition: all .48s ease;
    width: auto
}

.LogoCarouselItem__button {
    align-items: center;
    display: flex;
    font-size: var(--font-size-s);
    font-weight: var(--font-weight-semibold);
    gap: .5rem;
    margin: 1.25rem 0 0
}

.LogoCarouselItem__button:after {
    background-color: var(--accent, var(--colour-lavender-light));
    background-image: var(--icon-arrow);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 50%;
    border-radius: 100%;
    content: "";
    display: block;
    height: 1.5rem;
    width: 1.5rem
}

.LogoCarousel--container>*+* {
    margin: 20px 0 0
}

.LogoCarouselItem--fade {
    opacity: .5
}

.Nav--dark-header .Nav {
    background: #fff
}

.Nav {
    --menu-gap: 1.5rem;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    transition: all .32s ease;
    z-index: 10000
}

.Nav--tracker {
    height: var(--combined-nav-height);
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    width: 10px;
    z-index: 1000
}

.Nav__psa {
    display: none
}

.Nav__secondary {
    background: var(--colour-purple-dark);
    height: var(--secondary-nav-height);
    overflow: hidden;
    white-space: nowrap
}

.Nav__secondary-menu ul {
    align-items: center;
    display: flex;
    gap: .5rem;
    list-style: none;
    margin: 0;
    padding: 0
}

.Nav__secondary-menu ul li {
    padding-top: 0 !important
}

.Nav__secondary-menu ul a {
    display: inline-block
}

.Nav__secondary--right {
    align-items: center;
    display: flex;
    gap: var(--menu-gap);
    justify-content: space-between;
    width: 100%
}

.Nav__secondary,
.Nav__secondary * {
    color: var(--colour-white);
    font-size: 12px
}

.Nav__secondary-grid {
    align-items: center;
    display: grid;
    height: 100%
}

.Nav--hide-secondary {
    transform: translate3d(0, calc(var(--secondary-nav-height)*-1), 0)
}

.Nav__main {
    height: var(--nav-height);
    transition: background .32s ease
}

.Nav__main--background {
    background: var(--colour-background)
}

.Nav--grid {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: space-between
}

.Nav__logo {
    display: inline-block
}

.Nav__logo:hover {
    opacity: 1
}

.Nav__logo img {
    height: var(--nav-logo-height);
    -o-object-fit: contain;
    object-fit: contain;
    width: auto
}

.Nav--container {
    background: rgba(48, 27, 93, .64);
    height: 800px;
    left: 0;
    max-height: calc(100vh - var(--combined-nav-height));
    min-height: 100vh;
    opacity: 0;
    overflow-y: scroll;
    padding: 1rem var(--margin) 120px;
    pointer-events: none;
    position: fixed;
    top: var(--combined-nav-height);
    transition: opacity .64s cubic-bezier(.18, .88, .33, 1);
    width: 100%;
    -webkit-overflow-scrolling: touch;
    align-items: flex-start;
    display: flex;
    justify-content: flex-end
}

.Nav--container::-webkit-scrollbar {
    display: none
}

.NavMenu--highlight {
    display: none
}

.NavActions {
    background: var(--colour-lavender-light);
    order: 1;
    padding: 1rem
}

.NavActions,
.NavActions a {
    font-size: 14px
}

.NavItem {
    position: relative;
    z-index: 2
}

.NavItem,
.NavLink {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.NavLink {
    color: var(--colour-purple-dark);
    display: inline-block;
    font-size: 14px
}

.NavLink:hover {
    opacity: 1
}

.NavLink--unlinked {
    cursor: default
}

.NavLink__chevron {
    background-color: var(--colour-purple-dark);
    background-image: var(--chevron-icon-white);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 50%;
    border-radius: 100%;
    display: inline-block;
    height: 1.5rem;
    transform: rotate(180deg);
    width: 1.5rem
}

.SubMenu {
    display: none;
    padding: .5rem 0 2rem
}

.SubMenu--grid {
    display: grid;
    grid-gap: .5rem;
    gap: .5rem
}

.MenuCard {
    align-items: end;
    background: var(--colour-black);
    border-radius: var(--border-radius);
    display: grid;
    overflow: hidden;
    position: relative
}

.MenuCard--linked {
    cursor: pointer
}

.MenuCard--linked .MenuCard__content:before {
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.MenuCard__graphic {
    overflow: hidden;
    position: absolute;
    transition: all 1s ease;
    z-index: 0;
    --graphic-scale: 160px;
    height: var(--graphic-scale);
    opacity: .72;
    right: calc(var(--graphic-scale)*-1/3);
    top: calc(var(--graphic-scale)*-1/2.5);
    width: var(--graphic-scale)
}

.MenuCard__graphic svg {
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    width: 100%
}

.MenuCard__graphic path {
    fill: var(--menu-card-theme)
}

.MenuCard__graphic:after {
    background: linear-gradient(transparent, var(--colour-black));
    content: "";
    display: block;
    height: 100%;
    mix-blend-mode: multiply;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 1
}

.MenuCard__content {
    font-weight: var(--font-weight-regular);
    line-height: 150%;
    max-width: 280px;
    padding: 1.25rem
}

.MenuCard__content .flow {
    position: relative;
    z-index: 1
}

.MenuCard__content .flow * {
    color: var(--colour-white)
}

.MenuCard__content .flow p {
    opacity: .8
}

.MenuList {
    padding: .5rem 0
}

.MenuList__title {
    color: var(--colour-lavender-mid);
    font-size: 12px;
    font-weight: var(--font-weight-semibold);
    letter-spacing: .18em;
    margin: 0 0 1rem;
    text-transform: uppercase
}

.MenuList__menu {
    list-style: none;
    margin: 0
}

.MenuList__menu>*+* {
    margin: .75rem 0 0
}

.MenuList__item {
    padding-top: 0
}

.MenuList__item a {
    display: flex
}

.MenuList__link {
    align-items: center;
    color: var(--colour-purple-dark);
    display: inline-flex;
    font-size: 14px;
    font-weight: var(--font-weight-bold);
    gap: .5rem;
    transition: all .32s ease
}

.MenuList__link:after {
    background: var(--icon-arrow);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: inline-block;
    height: .75rem;
    opacity: 0;
    transform: translateX(-.25rem);
    transition: all .32s ease;
    width: .75rem
}

.MenuSubtitled {
    padding: .5rem 0
}

.MenuSubtitled__item {
    display: block;
    position: relative
}

.MenuSubtitled__item:before {
    background: var(--colour-lavender-light);
    border-radius: .5rem;
    content: "";
    filter: blur(10px);
    height: calc(100% + 1rem);
    left: 50%;
    opacity: 0;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%) scale(.9);
    transition: all .32s ease;
    width: calc(100% + 1rem);
    z-index: 0
}

.MenuSubtitled__subtitle,
.MenuSubtitled__title {
    position: relative
}

.MenuSubtitled__title {
    align-items: center;
    color: var(--colour-purple-dark);
    display: flex;
    font-size: 14px;
    gap: .5rem
}

.MenuSubtitled__title:after {
    background: var(--icon-arrow);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: inline-block;
    height: .75rem;
    opacity: 0;
    transform: translateX(-.25rem);
    transition: all .32s ease;
    width: .75rem
}

.MenuSubtitled__subtitle {
    color: var(--colour-purple-dark);
    font-size: 13px;
    font-weight: var(--font-weight-regular);
    line-height: 160%
}

.MenuSubtitled>*+* {
    margin: 1.5rem 0 0
}

.MenuOverview {
    padding: .25rem
}

.MenuOverview,
.MenuOverview--linked {
    position: relative
}

.MenuOverview--linked>* {
    position: relative;
    z-index: 1
}

.MenuOverview__icon {
    align-content: center;
    background: var(--colour-lavender-light);
    border: 1px solid var(--colour-purple-dark-25);
    border-radius: 100%;
    display: none;
    justify-content: center;
    padding: 3px;
    place-content: center;
    transition: background .32s ease
}

.MenuOverview__icon img {
    height: 1.5rem;
    -o-object-fit: contain;
    object-fit: contain;
    width: 1.5rem
}

.MenuOverview__text h2,
.MenuOverview__text h3,
.MenuOverview__text h4,
.MenuOverview__text h5,
.MenuOverview__text h6 {
    font-size: 16px;
    font-weight: var(--font-weight-bold)
}

.MenuOverview__text,
.MenuOverview__text p {
    color: var(--colour-paragraph);
    font-size: 12px;
    font-weight: var(--font-weight-regular);
    line-height: 130%
}

.MenuOverview__text>*+* {
    margin: .75em 0 0
}

.MenuOverview__item {
    max-width: 320px
}

.MenuOverview__title {
    color: var(--colour-lavender-mid);
    font-size: 10px;
    font-weight: var(--font-weight-semibold);
    letter-spacing: .18em;
    line-height: 100%;
    margin: 1.5rem 0 0;
    text-transform: uppercase
}

.MenuOverview__link {
    align-items: center;
    color: var(--colour-purple-dark);
    display: inline-flex;
    font-size: 12px;
    font-weight: var(--font-weight-bold);
    gap: .5rem;
    margin: 1rem 0 0
}

.MenuOverview__link:after {
    background: var(--icon-arrow);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: inline-block;
    height: .75rem;
    width: .75rem
}

.MenuOverview .MenuList__menu {
    margin: .75rem 0 0
}

.MenuOverview .MenuList__menu>*+* {
    margin: .25rem 0 0
}

.MenuOverview .MenuList__link {
    font-size: 13px
}

.MenuFeed {
    padding: .5rem 0
}

.MenuFeed__title {
    color: var(--colour-lavender-mid);
    font-size: 12px;
    font-weight: var(--font-weight-semibold);
    letter-spacing: .18em;
    margin: 0 0 1rem;
    text-transform: uppercase
}

.MenuFeed__posts {
    display: none;
    gap: 1.5rem
}

.MenuFeed__posts--active {
    display: grid
}

.MenuFeed__post--grid {
    display: grid;
    grid-gap: 1rem;
    gap: 1rem;
    grid-template-columns: 56px 1fr
}

.MenuFeed__details {
    max-height: 88px;
    overflow: hidden
}

.MenuFeed__image {
    aspect-ratio: 1/1;
    border-radius: .25rem;
    display: block;
    height: auto;
    overflow: hidden;
    width: 100%
}

.MenuFeed__image img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: transform .64s ease;
    width: 100%
}

.MenuFeed__post-title {
    color: var(--colour-purple-dark);
    font-size: 14px;
    font-weight: var(--font-weight-bold);
    line-height: 140%;
    transition: color .32s ease
}

.MenuFeed__tags {
    display: none
}

.MenuFeed__view-more {
    align-items: center;
    color: var(--colour-purple-dark);
    display: inline-flex;
    font-size: 14px;
    gap: .5rem;
    margin: 1rem 0 0
}

.MenuFeed__view-more:after {
    background: var(--icon-arrow);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: inline-block;
    height: .75rem;
    width: .75rem
}

.MenuCTA {
    background: var(--colour-black);
    border-radius: .5rem;
    padding: .75rem .75rem .75rem 1.5rem
}

.MenuCTA * {
    color: var(--colour-white)
}

.MenuCTA--grid {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    justify-content: space-between
}

.MenuCTA__logo {
    width: 180px
}

.MenuCTA__logo img {
    height: auto;
    max-height: 80px;
    -o-object-fit: contain;
    object-fit: contain;
    width: 100%
}

.MenuCTA__text {
    font-size: 14px;
    justify-self: center;
    line-height: 145%;
    max-width: max(340px, min(100%, 60%))
}

.LanguageToggle {
    align-items: center;
    display: flex;
    gap: .5rem
}

.LanguageToggle__link {
    cursor: pointer;
    display: inline-block;
    font-size: 12px;
    font-weight: var(--font-weight-regular);
    text-transform: uppercase;
    transition: all .32s ease
}

.LanguageToggle__link img {
    border-radius: 100%;
    height: 16px;
    -o-object-fit: contain;
    object-fit: contain;
    width: 16px
}

.LanguageToggle__link--current {
    align-items: center;
    cursor: default;
    display: flex;
    gap: .5rem
}

.LanguageToggle__link--current img {
    border: 1px solid #fff
}

.Nav__toggle {
    cursor: pointer;
    padding: .4rem 0
}

.Nav__toggle,
.Nav__toggle:after,
.Nav__toggle:before {
    display: block;
    transition: all .32s cubic-bezier(.645, .045, .355, 1)
}

.Nav__toggle:after,
.Nav__toggle:before {
    background: var(--colour-black);
    border-radius: 1rem;
    content: "";
    height: 2px;
    margin: 4px 0;
    width: 40px
}

.Nav__toggle--active {
    transform: rotate(-180deg) translate3d(-3px, 1px, 0)
}

.Nav__toggle--active:before {
    transform: rotate(-45deg) translate(1px, 4px)
}

.Nav__toggle--active:after {
    transform: rotate(45deg) translateY(-5px)
}

.Nav--landing .Nav__logo {
    padding: 1.5rem 0
}

.RichText--centre {
    margin: 0 auto
}

.RichText .flow {
    max-width: var(--rich-text-max-width)
}

.RichText img {
    border-radius: var(--border-radius)
}

.RichText blockquote {
    background: var(--module-accent-colour-light)
}

.SectionTitle .row--no-bottom-padding {
    padding-bottom: 5px
}

.SectionTitle .SectionTitle--container {
    max-width: var(--max-width)
}

.SectionTitle--two-column {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 2rem;
    align-items: start;
    gap: 2rem
}

.SectionTitle__buttons {
    margin: 2rem 0 0
}

.TwoColumnBanner__container {
    align-items: center;
    justify-content: center
}

.TwoColumnBanner__container--top-align {
    align-items: flex-start
}

.TwoColumnBanner__text-column {
    display: flex;
    flex-direction: column;
    gap: var(--m-spacing);
    width: 47%
}

.TwoColumnBanner__text-column--wide {
    width: 65%
}

.TwoColumnBanner__text-column--wide-2 {
    width: 55%
}

.TwoColumnBanner__text-column--narrow {
    width: 43%
}

.TwoColumnBanner__text-column img {
    height: auto;
    -o-object-fit: contain;
    object-fit: contain;
    width: 100%
}

.TwoColumnBanner__text-column-title {
    color: var(--colour-heading);
    font-family: var(--font-family-heading);
    font-size: 14px;
    font-weight: var(--font-weight-bold);
    letter-spacing: 2.1px;
    text-transform: uppercase
}

.TwoColumnBanner__text-and-button-container {
    align-items: center;
    display: inline-flex;
    gap: var(--m-spacing);
    justify-content: flex-start;
    margin-bottom: var(--s-spacing)
}

.TwoColumnBanner__text-column-bottom-container {
    margin-top: var(--s-spacing)
}

.TwoColumnBanner__text-column-bottom-container--mobile {
    margin-top: 0
}

.TwoColumnBanner__cards-container {
    gap: var(--m-spacing)
}

.TwoColumnBanner__second-column {
    align-items: center;
    display: flex;
    width: 53%
}

.TwoColumnBanner__second-column--narrow {
    width: 35%
}

.TwoColumnBanner__second-column--narrow-2 {
    width: 45%
}

.TwoColumnBanner__second-column--wide {
    width: 57%
}

.TwoColumnBanner__second-column--steps-container {
    display: grid;
    grid-gap: var(--xl-spacing);
    gap: var(--xl-spacing);
    overflow: hidden;
    position: relative;
    z-index: 1
}

.TwoColumnBanner__second-column--steps-container--left {
    padding: var(--xl-spacing);
    padding-right: var(--m-spacing)
}

.TwoColumnBanner__second-column--steps-container--right {
    padding: var(--xl-spacing);
    padding-left: var(--m-spacing)
}

.TwoColumnBanner__second-column--steps-container .bg-decor-shape-wrapper {
    bottom: auto;
    height: 60%;
    top: 0;
    transform: none
}

.TwoColumnBanner__second-column .TwoColumnBanner__step-container {
    display: flex;
    gap: var(--l-spacing)
}

.TwoColumnBanner__second-column .TwoColumnBanner__step-icon {
    align-items: center;
    aspect-ratio: 1;
    background: var(--element-accent-colour);
    border-radius: 50%;
    color: var(--colour-heading);
    display: flex;
    height: var(--xl-spacing);
    justify-content: center
}

.TwoColumnBanner__second-column .TwoColumnBanner__step-icon img {
    height: 24px;
    -o-object-fit: contain;
    object-fit: contain;
    width: 24px
}

.TwoColumnBanner__second-column .TwoColumnBanner__step-icon--svg {
    background-color: var(--element-accent-colour)
}

.TwoColumnBanner__second-column .TwoColumnBanner__step-icon--svg img {
    width: 60%
}

.TwoColumnBanner__second-column--single-column {
    max-width: 1000px;
    width: 100%
}

.TwoColumnBanner__second-column .TwoColumnBanner__element--border-radius,
.TwoColumnBanner__second-column.TwoColumnBanner__element--border-radius {
    border-radius: var(--border-radius)
}

.TwoColumnBanner__second-column img {
    height: auto;
    -o-object-fit: contain;
    object-fit: contain;
    width: 100%
}

.TwoColumnBanner--benefits .TwoColumnBanner--grid {
    display: grid;
    grid-gap: var(--xl-spacing);
    gap: var(--xl-spacing)
}

.TwoColumnBanner--benefits .TwoColumnBanner--grid .TwoColumnBanner--left {
    align-content: start;
    display: inline-grid;
    gap: 2rem
}

.TwoColumnBanner--benefits .TwoColumnBanner__optional {
    display: inline-grid;
    gap: 2rem
}

.TwoColumnBanner--benefits .TwoColumnBannerCTA {
    align-items: center;
    background: var(--accent-light, var(--colour-lavender-light));
    border: 1px solid var(--accent);
    border-radius: 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 2rem;
    justify-content: space-between;
    padding: 1rem
}

.TwoColumnBanner--benefits .TwoColumnBannerCTA__text h3,
.TwoColumnBanner--benefits .TwoColumnBannerCTA__text h4,
.TwoColumnBanner--benefits .TwoColumnBannerCTA__text h5 {
    font-size: var(--font-size-h6)
}

.TwoColumnBanner--benefits .TwoColumnBannerCTA__text>*+* {
    margin: .25rem 0 0
}

.TwoColumnBanner--benefits .TwoColumnBanner__testimonials {
    --quote-spacing: 1.5rem;
    --nav-size: 2rem;
    background: var(--colour-purple-dark);
    border-radius: 12px;
    min-height: calc(380px + var(--quote-spacing));
    padding: var(--quote-spacing) var(--quote-spacing) calc(var(--quote-spacing) + var(--nav-size) + 1.5rem);
    position: relative
}

.TwoColumnBanner--benefits .TwoColumnBanner__testimonials * {
    color: var(--colour-white)
}

.TwoColumnBanner--benefits .TwoColumnBanner__testimonials .TwoColumnBannerQuote__text {
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h5);
    font-weight: var(--font-weight-semibold);
    line-height: 150%
}

.TwoColumnBanner--benefits .TwoColumnBanner__testimonials .TwoColumnBannerQuote__author {
    margin: 2rem 0 0
}

.TwoColumnBanner--benefits .TwoColumnBanner__testimonials .TwoColumnBannerQuote__author span {
    display: block;
    opacity: .75
}

.TwoColumnBanner--benefits .TwoColumnBanner__testimonials .TwoColumnBanner__pagination {
    align-items: center;
    display: flex;
    gap: .5rem;
    position: absolute;
    right: var(--quote-spacing);
    top: var(--quote-spacing);
    z-index: 1
}

.TwoColumnBanner--benefits .TwoColumnBanner__testimonials .TwoColumnBanner__pagination-dot {
    background: var(--colour-white);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    height: .75rem;
    transition: all .32s ease;
    width: .75rem
}

.TwoColumnBanner--benefits .TwoColumnBanner__testimonials .TwoColumnBanner__pagination-dot.active {
    background: var(--accent)
}

.TwoColumnBanner--benefits .TwoColumnBanner__testimonials .TwoColumnBanner__pagination-dot.active:hover {
    opacity: 1
}

.TwoColumnBanner--benefits .TwoColumnBanner__testimonials .TwoColumnBanner__pagination-dot:hover {
    opacity: .75
}

.TwoColumnBanner--benefits .TwoColumnBanner__testimonials .TwoColumnBannerQuote__logo {
    margin: 0 0 1rem
}

.TwoColumnBanner--benefits .TwoColumnBanner__testimonials .TwoColumnBannerQuote__logo,
.TwoColumnBanner--benefits .TwoColumnBanner__testimonials .TwoColumnBannerQuote__logo img {
    height: 2rem;
    max-width: 180px;
    width: auto
}

.TwoColumnBanner--benefits .TwoColumnBanner__testimonials .TwoColumnBannerQuote__logo.white img {
    filter: grayscale(100%) brightness(100)
}

.TwoColumnBanner--benefits .TwoColumnBanner__testimonials .TwoColumnBanner__testimonials-nav {
    align-items: center;
    bottom: var(--quote-spacing);
    display: flex;
    gap: .5rem;
    left: var(--quote-spacing);
    position: absolute
}

.TwoColumnBanner--benefits .TwoColumnBanner__testimonials .TwoColumnBanner__testimonials-nav>button {
    background-color: var(--accent);
    background-image: var(--icon-arrow);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 40%;
    border: none;
    border-radius: 100%;
    cursor: pointer;
    height: var(--nav-size);
    transition: opacity .32s ease;
    width: var(--nav-size)
}

.TwoColumnBanner--benefits .TwoColumnBanner__testimonials .TwoColumnBanner__testimonials-nav>button:hover {
    opacity: .75
}

.TwoColumnBanner--benefits .TwoColumnBanner__testimonials .TwoColumnBanner__testimonials-nav>button:first-child {
    transform: rotate(180deg)
}

.TwoColumnBanner--stats .flow {
    max-width: 680px
}

.TwoColumnBanner--stats .flex {
    align-items: flex-start
}

.TwoColumnBanner--tabs .ImageTextTabs__image {
    aspect-ratio: 16/12;
    display: none;
    height: auto;
    -o-object-fit: contain;
    object-fit: contain;
    width: 100%
}

.TwoColumnBanner--tabs .ImageTextTabs__image.image-round-corners {
    -o-object-fit: cover;
    object-fit: cover
}

.TwoColumnBanner--tabs .ImageTextTabs__image--active {
    display: block
}

.Team.module {
    padding: 0 1rem;
    position: static
}

.TeamModal {
    background: rgba(18, 7, 40, .64);
    height: 100vh;
    left: 0;
    max-height: 100%;
    max-width: 100%;
    opacity: 0;
    pointer-events: none;
    position: fixed;
    top: 0;
    transition: all .32s ease;
    width: 100vw;
    z-index: 100000000000001
}

.TeamModal.open {
    opacity: 1;
    pointer-events: all
}

.TeamModal--grid {
    height: 100%;
    overflow-y: auto;
    padding-right: .5rem
}

.TeamModal--grid::-webkit-scrollbar {
    display: block !important;
    width: 8px
}

.TeamModal--grid::-webkit-scrollbar-thumb {
    background: var(--colour-lavender);
    border-radius: 9px
}

.TeamModal--grid::-webkit-scrollbar-track {
    background: var(--colour-white);
    border-radius: 9px;
    margin-top: 2rem
}

.TeamModal--container {
    background: var(--colour-black);
    border-radius: var(--border-radius);
    height: calc(100% - var(--combined-nav-height)/2);
    left: 50%;
    margin: 0 auto;
    max-height: 580px;
    max-width: calc(100% - var(--margin)*2);
    padding: 1.6rem;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%
}

.TeamModal--container:after {
    background: var(--team-background);
    background-position: 100% 0;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%
}

.TeamModal__close {
    --close-icon-size: 1.75rem;
    background: var(--colour-lilac-light);
    border-radius: 100%;
    cursor: pointer;
    height: var(--close-icon-size);
    position: fixed;
    right: 1rem;
    top: 1rem;
    transition: all .32s ease;
    width: var(--close-icon-size);
    z-index: 2
}

.TeamModal__close:before {
    color: var(--colour-black);
    content: "×";
    font-size: var(--close-icon-size);
    left: 50%;
    line-height: var(--close-icon-size);
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%)
}

.TeamModal__close:hover {
    background: var(--colour-purple-light)
}

.TeamModal--top,
.TeamModal__bio {
    position: relative;
    z-index: 1
}

.TeamModal--top {
    align-items: center;
    display: flex;
    gap: 2rem
}

.TeamModal__portrait img {
    aspect-ratio: 1/1;
    border-radius: 1rem;
    height: 100px;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100px
}

.TeamModal__bio {
    margin: 1.75rem 0 0
}

.TeamModal__bio * {
    color: var(--colour-white)
}

.TeamModal .TeamCard__role {
    font-size: 14px
}

.TeamModal .TeamCard__member-name {
    color: var(--colour-white);
    font-size: var(--font-size-h6);
    margin: 0 0 .5rem
}

.TeamCard {
    background: var(--colour-black);
    border-radius: var(--border-radius);
    display: flex;
    flex-direction: column;
    height: auto;
    justify-content: flex-end;
    overflow: hidden;
    padding: 0 var(--s-spacing);
    position: relative;
    width: 100%;
    z-index: 1
}

.TeamCard :not(a):not(button):not(.tag-text) {
    color: var(--colour-white)
}

.TeamCard__bottom {
    display: flex;
    flex-direction: column;
    gap: calc(var(--s-spacing)/2);
    margin-bottom: var(--s-spacing);
    z-index: 1
}

.TeamCard__role {
    background: var(--module-accent-colour-light);
    border-radius: 100px;
    padding: 10px 20px;
    width: -moz-fit-content;
    width: fit-content
}

.TeamCard__portrait {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: all .3s ease-in-out;
    width: 100%
}

.TeamCard__portrait:after {
    background: var(--team-card-gradient);
    border-radius: 0 0 var(--border-radius) var(--border-radius);
    bottom: 0;
    content: "";
    height: 40%;
    left: 0;
    position: absolute;
    width: 100%
}

.TeamCard__portrait img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%
}

.TeamCard__hidden-bio {
    display: none
}

.TeamCard__view-button {
    margin: 1rem 0 0
}

.Team .row--no-top-padding {
    padding-top: calc(var(--m-spacing)/2)
}

.Team .row--no-bottom-padding {
    padding-bottom: calc(var(--m-spacing)/2)
}

.TabbedContent__container {
    border-radius: var(--m-spacing);
    display: grid;
    padding: var(--l-spacing);
    grid-gap: var(--l-spacing);
    gap: var(--l-spacing)
}

.TabbedContent__heading {
    margin: 0 auto;
    max-width: 1025px;
    text-align: center
}

.TabbedContent__buttons {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--s-spacing);
    justify-content: center
}

.TabbedContent__button {
    align-items: center;
    background: var(--colour-white);
    border: 2px solid;
    border-color: var(--colour-white);
    border-radius: 100px;
    color: var(--button-colour);
    cursor: pointer;
    display: inline-flex;
    font-family: var(--font-family-link);
    font-size: var(--font-size-s);
    font-weight: var(--font-weight-bold);
    line-height: 1;
    overflow: hidden;
    padding: 11px 22px 11px 18px;
    position: relative;
    text-wrap: nowrap;
    transition: all .3s ease-in-out, scale 0s;
    z-index: 1
}

.TabbedContent__button:after {
    background: var(--colour-purple-dark);
    border-radius: 100px;
    content: "";
    height: calc(100% + 4px);
    left: -2px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    top: -2px;
    transition: all .35s ease-in-out;
    width: 44px;
    z-index: -1
}

.TabbedContent__button:hover {
    border-color: var(--colour-purple-dark);
    color: var(--colour-white)
}

.TabbedContent__button:hover:after {
    opacity: 1;
    width: calc(100% + 4px)
}

.TabbedContent__button:active {
    scale: .98
}

.TabbedContent__button--active {
    background: var(--colour-purple-dark);
    border-color: var(--colour-purple-dark);
    color: var(--colour-white)
}

.TabbedContent__tab-content {
    align-items: center;
    display: grid;
    grid-gap: var(--l-spacing);
    gap: var(--l-spacing);
    height: 0;
    opacity: 0;
    visibility: hidden
}

.TabbedContent__tab-content--active {
    height: auto;
    opacity: 1;
    visibility: visible
}

.TabbedContent__text-column {
    display: flex;
    flex-direction: column;
    gap: var(--m-spacing)
}

.TabbedContent__text-column-bottom-container {
    margin-top: calc(var(--s-spacing)/2)
}

.TabbedContent__second-column {
    align-items: center;
    display: flex;
    justify-content: center
}

.TabbedContent__second-column img {
    height: auto;
    -o-object-fit: contain;
    object-fit: contain;
    width: 100%
}

.TabbedContent .hs-embed-wrapper[data-service="fast.wistia"] {
    aspect-ratio: 16/9;
    border-radius: var(--border-radius);
    height: auto;
    max-width: 100% !important;
    overflow: hidden;
    width: 100% !important
}

.TabbedContent .wistia_embed {
    aspect-ratio: 16/9;
    height: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    width: 100% !important
}

.Recommendations {
    background: var(--colour-purple-dark);
    border-radius: 20px;
    padding: 1.5rem;
    width: 100%
}

.Recommendations * {
    color: var(--colour-white)
}

.Recommendations__title {
    align-items: center;
    border-bottom: 1px solid hsla(0, 0%, 100%, .25);
    display: flex;
    font-size: 11px;
    font-weight: var(--font-weight-bold);
    gap: .5rem;
    letter-spacing: .15em;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    text-transform: uppercase;
    width: 100%
}

.Recommendations--row {
    display: grid;
    grid-gap: 2rem;
    gap: 2rem
}

.RecommendationsItem {
    --icon-size: 2rem;
    display: grid;
    grid-gap: 1rem;
    gap: 1rem;
    grid-template-columns: var(--icon-size) 1fr
}

.RecommendationsItem__title {
    align-items: center;
    display: flex;
    gap: .5rem
}

.RecommendationsItem__title:after {
    background: var(--icon-arrow-white);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: inline-block;
    height: 1rem;
    width: 1rem
}

.RecommendationsItem__text {
    font-weight: var(--font-weight-regular);
    max-width: 320px;
    opacity: .75
}

.RecommendationsItem__icon {
    align-items: center;
    background: var(--colour-lavender-light);
    border-radius: 100%;
    display: flex;
    height: var(--icon-size);
    justify-content: center;
    width: var(--icon-size)
}

.RecommendationsItem__icon img {
    height: 60%;
    -o-object-fit: contain;
    object-fit: contain;
    width: 60%
}

.Testimonials__slider-item {
    background: var(--element-accent-colour-light);
    border-radius: var(--border-radius);
    display: flex;
    flex-direction: column;
    gap: var(--m-spacing);
    height: 100%;
    padding: var(--m-spacing)
}

.Testimonials__text {
    color: var(--colour-purple-dark)
}

.Testimonials__bottom {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--m-spacing);
    justify-content: space-between
}

.Testimonials__author-company {
    display: flex;
    flex-direction: column;
    gap: calc(var(--s-spacing)/2)
}

.Testimonials__author,
.Testimonials__company {
    line-height: 1
}

.Testimonials__author {
    font-weight: var(--font-weight-semibold)
}

.Timeline__container {
    margin: 0 auto;
    max-width: 1050px;
    position: relative
}

.Timeline__timestamps-container {
    width: 100%
}

.Timeline__item,
.Timeline__timestamps-container {
    display: flex;
    flex-direction: column;
    gap: var(--m-spacing)
}

.Timeline__item {
    background: var(--element-accent-colour-light);
    border-radius: var(--border-radius);
    margin-left: 100px;
    padding: var(--m-spacing);
    position: relative
}

.Timeline__item:after {
    border: 40px solid transparent;
    border-right: 40px solid var(--element-accent-colour-light);
    content: "";
    height: 0;
    margin-top: 0;
    pointer-events: none;
    position: absolute;
    right: 100%;
    top: 50px;
    width: 0
}

.Timeline__line {
    background: var(--colour-black);
    height: 0;
    left: -89px;
    max-height: calc(100% + var(--m-spacing));
    position: absolute;
    top: 90px;
    transition: height .4s cubic-bezier(.69, .35, 0, 1) .1s;
    width: 2px
}

.Timeline__line--active {
    height: calc(100% + var(--m-spacing)) !important
}

.Timeline__line--active.Timeline__line--last:after {
    opacity: 1
}

.Timeline__line--last {
    background: linear-gradient(180deg, var(--colour-black) 0, var(--colour-green) 100%);
    max-height: calc(100% - 90px)
}

.Timeline__line--last:after {
    background: var(--chevron-icon-green);
    background-repeat: no-repeat;
    background-size: 100%;
    content: "";
    left: 50%;
    top: 101%;
    transform: translate(-50%, -100%) rotate(180deg);
    transition: opacity .3s ease-in-out .3s
}

.Timeline__dot,
.Timeline__line--last:after {
    height: 24px;
    opacity: 0;
    position: absolute;
    width: 24px
}

.Timeline__dot {
    background: var(--element-accent-colour);
    border-radius: 50%;
    left: -100px;
    scale: 0;
    top: 90px;
    transform: translateY(-50%);
    transition: all .3s ease-in-out
}

.Timeline__dot--active {
    opacity: 1;
    scale: 1
}

.Timeline__text .h3 {
    color: var(--colour-purple-dark)
}

.SidebarCta {
    background: var(--colour-purple-dark);
    border-radius: var(--border-radius);
    color: var(--colour-white);
    padding: var(--s-spacing)
}

.SidebarCta__heading {
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h6);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-h6)
}

.SidebarHL {
    background: var(--colour-lavender-light);
    border-radius: var(--border-radius);
    padding: var(--s-spacing)
}

.SidebarHL__heading {
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h6);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-h6)
}

.SidebarHL__links {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    list-style: none;
    margin: 1rem 0 0;
    padding: 0
}

.SidebarHL__link {
    color: var(--colour-purple-dark);
    font-size: var(--font-size-s);
    -webkit-text-decoration: underline;
    text-decoration: underline;
    transition: opacity .2s ease-in-out
}

.SidebarHL__link:after {
    background-image: var(--icon-article-arrow);
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: inline-block;
    height: 15px;
    margin: 0 0 0 .4rem;
    transition: all .2s ease-in-out;
    width: 15px
}

.SidebarHL__link:hover {
    opacity: .8
}

.SidebarHL__link:hover:after {
    filter: brightness(.8);
    transform: rotate(-45deg)
}

.TabbedCardGrid__container {
    display: flex;
    flex-direction: column;
    gap: var(--l-spacing)
}

.TabbedCardGrid__heading--center-align {
    text-align: center
}

.TabbedCardGrid__buttons {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--s-spacing)
}

.TabbedCardGrid__buttons--center-align {
    justify-content: center
}

.TabbedCardGrid__button {
    align-items: center;
    background: var(--module-accent-colour-light);
    border: 2px solid;
    border-color: var(--module-accent-colour-light);
    border-radius: 100px;
    color: var(--button-colour);
    cursor: pointer;
    display: inline-flex;
    font-family: var(--font-family-link);
    font-size: var(--font-size-s);
    font-weight: var(--font-weight-bold);
    line-height: 1;
    overflow: hidden;
    padding: 11px 22px 11px 18px;
    position: relative;
    text-wrap: nowrap;
    transition: all .3s ease-in-out, scale 0s;
    z-index: 1
}

.TabbedCardGrid__button:after {
    background: var(--colour-purple-dark);
    border-radius: 100px;
    content: "";
    height: calc(100% + 4px);
    left: -2px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    top: -2px;
    transition: all .35s ease-in-out;
    width: 44px;
    z-index: -1
}

.TabbedCardGrid__button:hover {
    border-color: var(--colour-purple-dark);
    color: var(--colour-white)
}

.TabbedCardGrid__button:hover:after {
    opacity: 1;
    width: calc(100% + 4px)
}

.TabbedCardGrid__button:active {
    scale: .98
}

.TabbedCardGrid__button--active {
    background: var(--colour-purple-dark);
    border-color: var(--colour-purple-dark);
    color: var(--colour-white)
}

.TabbedCardGrid__tabs-content {
    position: relative
}

.TabbedCardGrid__tab-content {
    display: flex;
    gap: calc(var(--m-spacing)/2);
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: all .1s ease-in-out
}

.TabbedCardGrid__tab-content--active {
    opacity: 1
}

.TabbedCardGrid__tab-content .TabbedCardGrid__first-card {
    flex: 1
}

.TabbedCardGrid__tab-content .TabbedCardGrid__other-cards {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: calc(var(--m-spacing)/2);
    height: 100%
}

.bg-colour-dark .TabbedCardGrid__button:after {
    background: var(--module-accent-colour)
}

.bg-colour-dark .TabbedCardGrid__button:hover {
    border-color: var(--module-accent-colour)
}

.bg-colour-dark .TabbedCardGrid__button--active {
    background: var(--module-accent-colour);
    border-color: var(--module-accent-colour)
}

.StickyFeature {
    overflow: visible
}

.StickyFeature__features-column {
    display: flex;
    flex-direction: column;
    gap: var(--l-spacing);
    width: 50%
}

.StickyFeature__feature:not(:last-child) {
    margin-bottom: calc(var(--l-spacing)*5)
}

.StickyFeature__features-media-column {
    height: -moz-max-content;
    height: max-content;
    position: sticky;
    top: calc(var(--vertical-spacing)*2);
    width: 50%
}

.StickyFeature__features-media-wrapper {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: auto;
    overflow: hidden;
    width: 100%
}

.StickyFeature__feature-media {
    height: auto
}

.StickyFeature__image {
    border-radius: var(--border-radius);
    overflow: hidden
}

.StickyFeature__image--contain {
    border-radius: 0
}

.StickyFeature__image--contain img {
    -o-object-fit: contain !important;
    object-fit: contain !important
}

.StickyFeature__image img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%
}

.ScrollCards {
    overflow: visible
}

.ScrollCards--disable .ScrollCard {
    position: static !important;
    top: auto !important
}

.ScrollCards__heading {
    margin-bottom: var(--l-spacing);
    text-align: center
}

.ScrollCards__container {
    display: flex;
    flex-direction: column;
    gap: var(--m-spacing)
}

.ScrollCard {
    --pin-start: calc(var(--nav-height) + var(--m-spacing));
    --title-height: calc(var(--l-spacing) + var(--m-spacing)*2);
    background: var(--element-bg-colour-light);
    border: 1px solid rgba(29, 8, 67, .25);
    border-radius: calc(var(--border-radius)*2);
    padding: var(--m-spacing);
    position: sticky
}

.ScrollCard:first-child {
    top: calc(var(--pin-start) + var(--title-height)*0)
}

.ScrollCard:nth-child(2) {
    top: calc(var(--pin-start) + var(--title-height)*1)
}

.ScrollCard:nth-child(3) {
    top: calc(var(--pin-start) + var(--title-height)*2)
}

.ScrollCard:nth-child(4) {
    top: calc(var(--pin-start) + var(--title-height)*3)
}

.ScrollCard>* p {
    color: var(--colour-heading)
}

.ScrollCard__title {
    align-items: center;
    border-bottom: 1px solid rgba(48, 27, 93, .25);
    display: inline-flex;
    gap: var(--s-spacing);
    padding-bottom: var(--m-spacing);
    width: 100%
}

.ScrollCard__number {
    align-items: center;
    background-color: var(--colour-purple-dark);
    border-radius: 50%;
    color: var(--colour-heading);
    color: var(--colour-white);
    display: flex;
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h4);
    font-weight: var(--font-weight-semibold);
    height: var(--l-spacing);
    justify-content: center;
    line-height: 1;
    min-width: var(--l-spacing);
    width: var(--l-spacing)
}

.ScrollCard__number--list {
    align-self: first baseline;
    background: none;
    border-radius: 0;
    color: var(--colour-purple-dark);
    font-size: var(--font-size-h6)
}

.ScrollCard__number--list,
.ScrollCard__tick-icon {
    height: var(--s-spacing);
    min-width: var(--s-spacing);
    width: var(--s-spacing)
}

.ScrollCard__tick-icon {
    background-color: var(--element-accent-colour);
    background-image: var(--check-mark-dark);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 50%;
    border-radius: 50%
}

.ScrollCard__icon--list img {
    min-width: var(--m-spacing) !important;
    width: var(--m-spacing) !important
}

.ScrollCard__icon img {
    align-self: first baseline;
    height: auto;
    min-width: var(--l-spacing);
    overflow: visible;
    width: var(--l-spacing)
}

.ScrollCard__content {
    display: flex;
    gap: var(--m-spacing);
    margin-top: var(--m-spacing)
}

.ScrollCard__additional-info,
.ScrollCard__text {
    flex: 1
}

.ScrollCard__additional-info-title {
    color: var(--colour-heading);
    font-family: var(--font-family-heading);
    font-size: var(--font-size-s);
    font-weight: var(--font-weight-bold);
    letter-spacing: 2.1px;
    margin-bottom: var(--s-spacing);
    text-transform: uppercase
}

.ScrollCard__list {
    display: flex;
    flex-direction: column;
    gap: var(--s-spacing)
}

.ScrollCard__list-item {
    align-items: center;
    display: inline-flex;
    gap: calc(var(--m-spacing)/2)
}

.ScrollCard__list-item--numbers {
    align-items: baseline
}

.ScrollCard__item-text {
    color: var(--colour-heading)
}

.ScrollCard__image {
    border-radius: var(--border-radius);
    overflow: hidden
}

.ScrollCard__image--contain img {
    -o-object-fit: contain !important;
    object-fit: contain !important
}

.ScrollCard__image img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%
}

.ScrollCard__button-wrapper {
    display: flex;
    justify-content: flex-end;
    margin-top: var(--m-spacing)
}

.HeroFeatureTabs__heading {
    margin: 0 auto var(--l-spacing);
    max-width: 1000px;
    text-align: center
}

.HeroFeatureTabs__images {
    margin: 0 auto;
    max-width: 1000px
}

.HeroFeatureTabs__image {
    border-radius: var(--border-radius);
    display: none;
    height: auto;
    overflow: hidden;
    width: 100%
}

.HeroFeatureTabs__image--active {
    animation: fadeImage .5s ease-in-out;
    display: block
}

@keyframes fadeImage {
    0% {
        opacity: 0;
        transform: translateY(.5rem)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.HeroFeatureTabs__image--contain img {
    -o-object-fit: contain !important;
    object-fit: contain !important
}

.HeroFeatureTabs__image img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%
}

.HeroFeatureTabs__cards {
    background: linear-gradient(180deg, hsla(0, 0%, 100%, 0) 0, var(--colour-white) 15%);
    gap: var(--s-spacing);
    margin-top: calc(var(--m-spacing)*2*-1);
    position: relative;
    z-index: 10
}

.HeroFeatureTabs__cards--dark {
    background: linear-gradient(180deg, hsla(0, 0%, 100%, 0) 0, var(--colour-black) 15%)
}

.HeroFeatureTabsItem {
    background-color: var(--colour-white);
    border: 1px solid rgba(29, 8, 67, .25);
    border-radius: var(--border-radius);
    box-shadow: 0 0 15px 0 rgba(0, 0, 0, .02);
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: var(--s-spacing);
    justify-content: space-between;
    padding: var(--m-spacing)
}

.HeroFeatureTabsItem--active {
    background-color: var(--module-accent-colour-light);
    transition: background-colour .32s ease-in-out
}

.HeroFeatureTabsItem__bottom,
.HeroFeatureTabsItem__top {
    display: flex;
    flex-direction: column;
    gap: var(--s-spacing)
}

.HeroFeatureTabsItem__title {
    color: var(--colour-purple-dark);
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h5);
    font-weight: var(--font-weight-bold)
}

.HeroFeatureTabsItem__text {
    color: var(--colour-heading)
}

.HeroFeatureTabsItem__timer {
    background: rgba(0, 0, 0, .075);
    border-radius: 8px;
    height: 6px;
    justify-self: flex-end;
    overflow: hidden;
    width: 100%
}

.HeroFeatureTabsItem__timer--bar {
    background: var(--module-accent-colour);
    height: 6px;
    width: 0
}

.bg-colour-dark .HeroFeatureTabsItem .Button--circle a,
.bg-colour-dark .HeroFeatureTabsItem .Button--circle button {
    color: var(--button-colour)
}

.Feature__container {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: var(--xl-spacing)
}

.Feature__container .Cards__container {
    width: 100%
}

.Feature__title--left {
    align-self: flex-start
}

.Feature__image {
    border-radius: var(--border-radius);
    overflow: hidden;
    width: 100%
}

.Feature__image--contain {
    border-radius: 0
}

.Feature__image--contain img {
    -o-object-fit: contain !important;
    object-fit: contain !important
}

.Feature__image img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%
}

.CardsGrid {
    overflow: visible
}

.CardsGrid__container {
    align-items: flex-start;
    justify-content: center
}

.CardsGrid__inner-container {
    display: flex;
    flex: 3;
    flex-direction: column;
    gap: var(--xl-spacing)
}

.CardsGrid__header {
    display: flex;
    flex-direction: column;
    gap: var(--m-spacing)
}

.CardsGrid__header--sticky {
    background: var(--module-background-colour);
    margin: calc(var(--m-spacing)*-1) 0;
    padding: var(--m-spacing) 0;
    position: sticky;
    top: calc(var(--nav-height));
    z-index: 10
}

.CardsGrid__header--divider {
    border-bottom: 1px solid rgba(48, 27, 93, .25);
    margin-bottom: calc(var(--xl-spacing)/2*-1);
    padding-bottom: calc(var(--xl-spacing)/2)
}

.CardsGrid .Cards__container {
    grid-template-columns: 1fr 1fr;
    height: -moz-max-content;
    height: max-content
}

.CardsGrid .Cards__container--single-col {
    grid-template-columns: 1fr
}

.CardsGrid__image {
    border-radius: var(--border-radius);
    flex: 2;
    overflow: hidden;
    position: sticky;
    top: calc(var(--nav-height) + var(--m-spacing));
    width: 100%
}

.CardsGrid__image--mobile {
    display: none
}

.CardsGrid__image--desktop {
    display: block
}

.CardsGrid__image--contain {
    border-radius: 0
}

.CardsGrid__image--contain img {
    -o-object-fit: contain !important;
    object-fit: contain !important
}

.CardsGrid__image img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%
}

.CardsGrid__video {
    flex: 2;
    overflow: hidden;
    position: sticky;
    top: calc(var(--nav-height) + var(--m-spacing));
    width: 100%
}

.CardsGrid__video--mobile {
    display: none
}

.CardsGrid__video--desktop {
    display: block
}

.bg-colour-dark .CardsGrid__header--divider {
    border-bottom: 1px solid hsla(0, 0%, 100%, .25)
}

.ButtonList__container {
    display: flex;
    flex-direction: column;
    gap: var(--l-spacing)
}

.ButtonList__list {
    display: flex;
    flex-direction: column;
    gap: var(--s-spacing)
}

.ButtonList__list .Button__wrapper {
    position: relative
}

.ButtonList__list .Button__wrapper .Button {
    width: -moz-max-content;
    width: max-content
}

.ButtonList__list .Button__wrapper .Button:hover .ButtonList__card {
    opacity: 1;
    transform: translateX(-100px);
    transition: all .4s cubic-bezier(.39, .58, .57, 1) .2s
}

.ButtonList__card {
    align-items: center;
    display: flex;
    gap: var(--l-spacing);
    max-width: 60%;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    transform: translateX(-250px);
    transition: all .4s cubic-bezier(.39, .58, .57, 1);
    width: 100%
}

.ButtonList__image {
    border-radius: var(--border-radius);
    flex: 1 1 50%;
    overflow: hidden
}

.ButtonList__image--contain {
    border-radius: 0
}

.ButtonList__image--contain img {
    -o-object-fit: contain !important;
    object-fit: contain !important
}

.ButtonList__image img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%
}

.ButtonList__icon {
    align-items: center;
    background: var(--element-accent-colour-light);
    border: 1px solid var(--colour-purple-dark-25);
    border-radius: 50%;
    display: flex;
    flex: 1 1 var(--xl-spacing);
    height: var(--xl-spacing);
    justify-content: center;
    max-width: var(--xl-spacing);
    min-width: var(--xl-spacing);
    width: var(--xl-spacing)
}

.ButtonList__icon img {
    height: auto;
    overflow: visible;
    width: 60%
}

.ButtonList__card-text {
    flex: 1 1 50%
}

.bg-colour-dark .ButtonList__icon {
    border: 1px solid var(--element-accent-colour)
}

.ButtonList .Button--active .ButtonList__card {
    transition: all .4s cubic-bezier(.39, .58, .57, 1)
}

.ButtonList .Button--active .ButtonList__card,
.ButtonList .ButtonList__card--active {
    opacity: 1;
    pointer-events: auto;
    transform: translateX(-100px)
}

.ImageHotspotArea {
    overflow: visible;
    z-index: 2
}

.ImageHotspotArea__container {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: var(--l-spacing)
}

.ImageHotspotArea__editor-message {
    background: var(--module-accent-colour);
    color: var(--colour-heading);
    display: none;
    flex-wrap: wrap;
    font-size: 16px;
    gap: 2rem;
    justify-content: center;
    padding: 1rem;
    text-align: center
}

.ImageHotspotArea__editor-message span {
    background: var(--colour-purple-dark);
    color: var(--colour-white);
    font-weight: var(--font-weight-bold);
    padding: 2px 8px
}

.ImageHotspotArea__heading {
    max-width: 1000px;
    text-align: center
}

.ImageHotspotArea__content-container {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: var(--l-spacing);
    position: relative;
    width: 100%
}

.ImageHotspotArea__gate-form-wrapper {
    background: rgba(48, 27, 93, .5);
    border-radius: 40px;
    bottom: calc(var(--s-spacing)/2*-1);
    left: calc(var(--s-spacing)/2*-1);
    position: absolute;
    right: calc(var(--s-spacing)/2*-1);
    top: calc(var(--s-spacing)*-1);
    transition: all .4s ease-out, opacity .4s ease-out .2s;
    z-index: 3
}

.ImageHotspotArea__gate-form-wrapper--hidden {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    background: transparent;
    opacity: 0;
    pointer-events: none
}

.ImageHotspotArea__gate-form {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 80%;
    z-index: 10
}

.ImageHotspotArea__gate-form .h3 {
    font-size: var(--font-size-h5) !important;
    line-height: var(--line-height-h5) !important
}

.ImageHotspotArea__buttons {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--s-spacing);
    justify-content: center
}

.ImageHotspotArea__button {
    align-items: center;
    background: var(--module-accent-colour-light);
    border: 2px solid;
    border-color: var(--module-accent-colour-light);
    border-radius: 100px;
    color: var(--button-colour);
    cursor: pointer;
    display: inline-flex;
    font-family: var(--font-family-link);
    font-size: var(--font-size-s);
    font-weight: var(--font-weight-bold);
    line-height: 1;
    overflow: hidden;
    padding: 11px 22px 11px 18px;
    position: relative;
    text-wrap: nowrap;
    transition: all .3s ease-in-out, scale 0s;
    z-index: 1
}

.ImageHotspotArea__button:after {
    background: var(--colour-purple-dark);
    border-radius: 100px;
    content: "";
    height: calc(100% + 4px);
    left: -2px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    top: -2px;
    transition: all .35s ease-in-out;
    width: 44px;
    z-index: -1
}

.ImageHotspotArea__button:hover {
    border-color: var(--colour-purple-dark);
    color: var(--colour-white)
}

.ImageHotspotArea__button:hover:after {
    opacity: 1;
    width: calc(100% + 4px)
}

.ImageHotspotArea__button:active {
    scale: .98
}

.ImageHotspotArea__button--active {
    background: var(--colour-purple-dark);
    border-color: var(--colour-purple-dark);
    color: var(--colour-white)
}

.ImageHotspotArea__images {
    align-items: center;
    background: #e6e6e6;
    border-radius: calc(var(--border-radius)*3);
    box-shadow: 0 3.937px 12.599px 0 rgba(0, 0, 0, .1);
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    width: 100%
}

.ImageHotspotArea__images--contain {
    background: none;
    border-radius: 0
}

.ImageHotspotArea__images--contain .ImageHotspotArea__image {
    width: 100% !important
}

.ImageHotspotArea__images--contain .ImageHotspotArea__image--active {
    height: 100% !important
}

.ImageHotspotArea__images--contain .ImageHotspotArea__image img {
    border-radius: 0;
    -o-object-fit: contain;
    object-fit: contain
}

.ImageHotspotArea__image {
    height: 0;
    opacity: 0;
    position: relative;
    transition: opacity .3s ease-in-out;
    width: calc(100% - 2rem)
}

.ImageHotspotArea__image--active {
    height: calc(100% - 2rem);
    opacity: 1
}

.ImageHotspotArea__image--active .Hotspot {
    opacity: 1 !important;
    transition: opacity .7s ease-in-out .3s
}

.ImageHotspotArea__image img {
    border-radius: calc(var(--border-radius)*1.5);
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%
}

.ImageHotspotArea .Hotspot {
    border-radius: 50%;
    height: 80px;
    left: 50%;
    opacity: 0;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 80px;
    z-index: 1
}

.ImageHotspotArea .Hotspot--visible {
    z-index: 2
}

.ImageHotspotArea .Hotspot--visible .Hotspot__outer {
    background-color: var(--hs-light);
    transition: background-color .2s ease-in-out
}

.ImageHotspotArea .Hotspot--visible .Hotspot__inner {
    background-color: var(--hs-medium);
    transition: background-color .2s ease-in-out
}

.ImageHotspotArea .Hotspot--visible .Hotspot__message {
    opacity: 1
}

.ImageHotspotArea .Hotspot__outer {
    animation: pulsate 2.5s ease-in-out infinite;
    background-color: var(--hs-lighter);
    border-radius: 50%;
    height: 80px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 80px
}

@keyframes pulsate {
    0% {
        transform: translate(-50%, -50%) scale(1)
    }

    50% {
        transform: translate(-50%, -50%) scale(.9)
    }

    to {
        transform: translate(-50%, -50%) scale(1)
    }
}

.ImageHotspotArea .Hotspot__inner {
    background-color: var(--hs-light);
    border-radius: 50%;
    height: 60px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 60px
}

.ImageHotspotArea .Hotspot__icon {
    background-color: var(--hs-colour);
    background-image: var(--toast-close);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 40%;
    border-radius: 50%;
    height: 40px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    transform-origin: center center;
    width: 40px
}

.ImageHotspotArea .Hotspot__message {
    background: var(--colour-white);
    border: 2px solid #d7d0e0;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, .2);
    left: 120px;
    opacity: 0;
    padding: calc(var(--m-spacing)/2);
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: opacity .1s ease-in-out;
    width: 400px;
    z-index: 2
}

.ImageHotspotArea .Hotspot__message h1,
.ImageHotspotArea .Hotspot__message h2,
.ImageHotspotArea .Hotspot__message h3,
.ImageHotspotArea .Hotspot__message h4,
.ImageHotspotArea .Hotspot__message h5,
.ImageHotspotArea .Hotspot__message h6 {
    font-size: var(--font-size-p);
    margin-bottom: .3rem
}

.ImageHotspotArea .Hotspot__message p {
    font-size: var(--font-size-base);
    line-height: 140%
}

.ImageHotspotArea .Hotspot__message--move-down {
    top: -30px;
    transform: none
}

.ImageHotspotArea .Hotspot__message--move-down:before {
    top: 67px !important
}

.ImageHotspotArea .Hotspot__message--flipped-left {
    left: auto !important;
    right: 120px !important
}

.ImageHotspotArea .Hotspot__message--flipped-left:before {
    box-shadow: 0 5px 5px -4px rgba(0, 0, 0, .2) !important;
    left: auto !important;
    right: -21.4px !important;
    transform: translateY(-50%) rotate(-45deg) !important
}

.ImageHotspotArea .Hotspot__message--flipped-bottom {
    --offset: -100px;
    left: calc(var(--offset)) !important;
    top: 120px !important;
    transform: none !important
}

.ImageHotspotArea .Hotspot__message--flipped-bottom:before {
    box-shadow: none !important;
    left: calc(var(--offset)*-1 + 23px) !important;
    top: -21.4px !important;
    transform: translate(-50%) rotate(-135deg) !important
}

.ImageHotspotArea .Hotspot__message:before {
    background: var(--colour-white);
    border: 2px solid #d7d0e0;
    border-bottom-right-radius: 7px;
    border-left: none;
    border-top: none;
    box-shadow: 5px 0 5px -4px rgba(0, 0, 0, .2);
    content: "";
    height: 40px;
    left: -21.4px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%) rotate(135deg);
    transform-origin: center;
    width: 40px;
    z-index: -1
}

.bg-colour-dark .ImageHotspotArea__heading {
    color: var(--colour-white)
}

.bg-colour-dark .ImageHotspotArea__button:after {
    background: var(--module-accent-colour)
}

.bg-colour-dark .ImageHotspotArea__button:hover {
    border-color: var(--module-accent-colour)
}

.bg-colour-dark .ImageHotspotArea__button--active {
    background: var(--module-accent-colour);
    border-color: var(--module-accent-colour)
}

.ComparisonTable .custom-grid {
    display: grid;
    grid-gap: var(--s-spacing);
    gap: var(--s-spacing)
}

.ComparisonTable__heading {
    margin-bottom: var(--l-spacing)
}

.ComparisonTable__heading--center-align {
    text-align: center
}

.ComparisonTable__headings {
    margin-bottom: var(--s-spacing)
}

.ComparisonTable__features-title {
    align-self: self-end;
    color: var(--colour-heading);
    font-family: var(--font-family-heading);
    font-size: 14px;
    font-weight: var(--font-weight-bold);
    letter-spacing: 2.1px;
    line-height: 130%;
    text-transform: uppercase
}

.ComparisonTable__card-heading {
    align-items: center;
    background: var(--module-accent-colour-light);
    border: 1px solid rgba(29, 8, 67, .25);
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    gap: var(--m-spacing);
    justify-content: space-between;
    padding: var(--m-spacing)
}

.ComparisonTable__card-heading--recommended {
    background: var(--colour-purple-dark);
    position: relative
}

.ComparisonTable__card-heading--recommended .ComparisonTable__card-title {
    color: #fff
}

.ComparisonTable__card-heading--recommended .ComparisonTable__hot-top-features {
    border-top: 1px solid hsla(0, 0%, 100%, .2);
    color: var(--colour-white)
}

.ComparisonTable__card-heading--recommended .ComparisonTable__hot-top-features * {
    color: var(--colour-white)
}

.ComparisonTable__card-heading-inner {
    align-items: center;
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: var(--m-spacing);
    width: 100%
}

.ComparisonTable__recommended-label {
    align-items: center;
    background: var(--module-accent-colour);
    border-radius: 5px;
    color: var(--colour-heading);
    display: inline-flex;
    font-family: var(--font-family-heading);
    font-size: 14px;
    font-weight: var(--font-weight-bold);
    gap: 10px;
    justify-content: center;
    left: 50%;
    letter-spacing: 2.1px;
    line-height: 130%;
    padding: 4px 11px;
    position: absolute;
    text-transform: uppercase;
    top: 0;
    transform: translate(-50%, -50%)
}

.ComparisonTable__recommended-label span {
    background-image: var(--star-icon-dark);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    height: 1rem;
    min-width: 1rem;
    width: 1rem
}

.ComparisonTable__card-title {
    color: var(--colour-heading);
    font-family: var(--font-family-heading);
    font-size: 24px;
    font-weight: var(--font-weight-semibold);
    line-height: 130%;
    text-align: center
}

.ComparisonTable__card-title-logo {
    height: auto;
    margin: auto;
    width: 70%
}

.ComparisonTable__card-title-logo img {
    height: auto;
    -o-object-fit: contain;
    object-fit: contain;
    width: 100%
}

.ComparisonTable__hot-top-features {
    border-top: 1px solid rgba(29, 8, 67, .1);
    color: var(--colour-heading);
    display: flex;
    flex-direction: column;
    font-family: var(--font-family-heading);
    font-size: 12px;
    font-weight: var(--font-weight-bold);
    gap: 1rem;
    letter-spacing: 1.8px;
    line-height: 130%;
    padding-top: var(--m-spacing);
    text-transform: uppercase;
    width: 100%
}

.ComparisonTable__hot-top-feature {
    align-items: center;
    display: inline-flex;
    font-size: 14px;
    gap: .5rem;
    text-transform: none
}

.ComparisonTable__hot-top-feature .ComparisonTable__tick-icon {
    height: 19px;
    margin: 0;
    max-width: 19px;
    min-width: 19px;
    width: 19px
}

.ComparisonTable__heading-button-wrapper {
    width: 100%
}

.ComparisonTable__features-container {
    border: 1px solid transparent;
    display: flex;
    flex-direction: column;
    padding-right: 1rem
}

.ComparisonTable__feature {
    align-items: center;
    border-bottom: 1px solid rgba(29, 8, 67, .1);
    color: var(--colour-heading);
    display: inline-flex;
    font-family: var(--font-family-heading);
    font-size: 17px;
    font-weight: var(--font-weight-semibold);
    line-height: 153%;
    padding: 1rem 0;
    transition: all .2s ease-in-out, opacity .4s ease-in-out
}

.ComparisonTable__feature img {
    height: 20px;
    margin-right: .5rem;
    max-height: 20px;
    -o-object-fit: contain;
    object-fit: contain;
    width: auto
}

.ComparisonTable__feature--hidden {
    border: none;
    height: 0;
    opacity: 0;
    padding: 0;
    transition: none
}

.ComparisonTable__card {
    align-items: center;
    background: var(--module-accent-colour-light);
    border: 1px solid rgba(29, 8, 67, .25);
    border-radius: 10px;
    display: flex;
    flex-direction: column
}

.ComparisonTable__card--recommended {
    background: var(--colour-purple-dark)
}

.ComparisonTable__card--recommended .ComparisonTable__card-value {
    border-bottom: 1px solid hsla(0, 0%, 100%, .2)
}

.ComparisonTable__card--recommended .ComparisonTable__cross-icon {
    background-color: hsla(0, 0%, 100%, .2);
    background-image: var(--cross-white)
}

.ComparisonTable__card--recommended *,
.ComparisonTable__card--recommended .ComparisonTable__card-value-text {
    color: #fff
}

.ComparisonTable__card-value {
    border-bottom: 1px solid rgba(29, 8, 67, .1);
    padding: 1rem 0;
    transition: all .2s ease-in-out, opacity .4s ease-in-out;
    width: calc(100% - 2rem)
}

.ComparisonTable__card-value--hidden {
    border: none;
    height: 0;
    opacity: 0;
    padding: 0;
    transition: none
}

.ComparisonTable__card-value-error {
    background: red;
    border-radius: 4px;
    color: #fff;
    font-family: var(--font-family-heading);
    font-size: 17px;
    font-weight: var(--font-weight-semibold);
    line-height: 153%;
    padding: 0 .5rem;
    text-align: center
}

.ComparisonTable__tick-icon {
    background-color: var(--module-accent-colour);
    background-image: var(--check-mark-dark)
}

.ComparisonTable__cross-icon,
.ComparisonTable__tick-icon {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 50%;
    border-radius: 50%;
    height: 26px;
    margin: 0 auto;
    width: 26px
}

.ComparisonTable__cross-icon {
    background-color: rgba(29, 8, 67, .1);
    background-image: var(--cross-dark)
}

.ComparisonTable__card-value-text {
    text-align: center
}

.ComparisonTable__button,
.ComparisonTable__card-value-text {
    color: var(--colour-heading);
    font-family: var(--font-family-heading);
    font-size: 17px;
    font-weight: var(--font-weight-semibold);
    line-height: 153%
}

.ComparisonTable__button {
    align-items: center;
    background: none;
    border: none;
    cursor: pointer;
    display: inline-flex;
    gap: .5rem;
    justify-content: space-between;
    margin: .5rem 1rem .5rem 0;
    padding: .5rem 0;
    text-align: left
}

.ComparisonTable__button--active span {
    transform: rotate(180deg)
}

.ComparisonTable__button span {
    background-color: rgba(29, 8, 67, .1);
    background-image: var(--chevron-dark);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 50%;
    border-radius: 50%;
    height: 23px;
    min-width: 23px;
    transition: all .3s ease-in-out;
    width: 23px
}

.SubscriptionForm__container {
    align-items: center;
    background: var(--element-background-colour);
    border-radius: var(--border-radius);
    display: flex;
    gap: calc(var(--m-spacing)*2);
    justify-content: space-between;
    overflow: hidden;
    padding: var(--l-spacing);
    position: relative;
    z-index: 1
}

.SubscriptionForm__heading {
    color: var(--colour-white);
    flex: 48;
    width: 100%
}

.SubscriptionForm__form {
    flex: 52;
    width: 100%
}

.TLBanner--hero {
    align-items: center;
    border-top: 1px solid rgba(49, 19, 94, .25);
    display: flex;
    gap: var(--l-spacing);
    justify-content: space-between;
    margin-top: calc(var(--m-spacing)*2.3);
    padding-top: calc(var(--m-spacing)*2)
}

.TLBanner--hero .TLBanner__heading {
    color: var(--colour-purple-dark)
}

.TLBanner--hero .TLBanner__logos {
    gap: var(--l-spacing);
    justify-content: flex-end
}

.TLBanner--hero .TLBanner__logo {
    height: 55px !important
}

.TLBanner--hero .TLBanner__logo:not(:last-child) {
    border-right: 1px solid hsla(0, 0%, 100%, .25);
    padding-right: var(--l-spacing)
}

.TLBanner--hero--dark {
    border-top: 1px solid hsla(0, 0%, 100%, .25)
}

.TLBanner--hero--dark .TLBanner__heading {
    color: var(--colour-white)
}

.TLBanner--hero-2 {
    width: 100%
}

.TLBanner--hero-2 .TLBanner__container {
    background: var(--colour-purple-dark);
    gap: var(--m-spacing);
    padding: calc(var(--m-spacing)/2)
}

.TLBanner--hero-2 .TLBanner__heading {
    flex: initial;
    min-width: -moz-max-content;
    min-width: max-content;
    width: -moz-max-content;
    width: max-content
}

.TLBanner--hero-2 .TLBanner__logos {
    flex: initial;
    gap: calc(var(--s-spacing)/2);
    justify-content: flex-end
}

.TLBanner__container {
    align-items: center;
    background: var(--element-background-colour);
    border-radius: var(--border-radius);
    display: flex;
    gap: calc(var(--m-spacing)*2);
    justify-content: space-between;
    overflow: hidden;
    padding: var(--l-spacing);
    position: relative;
    z-index: 1
}

.TLBanner__heading {
    color: var(--colour-white);
    flex: 48;
    width: 100%
}

.TLBanner__logos {
    align-items: center;
    display: flex;
    flex: 52;
    gap: var(--s-spacing);
    justify-content: center;
    width: 100%
}

.TLBanner__logo {
    height: 70px;
    transition: all .2s ease-in !important
}

.TLBanner__logo img {
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    width: auto
}

.PodcastsListingHero.TwoColumnBanner .wrapper {
    padding-top: var(--combined-nav-height)
}

.PodcastsListingHero__featured-container {
    background: rgba(49, 19, 94, .15);
    border: 1px solid rgba(49, 19, 94, .25);
    border-radius: 12px;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, .1);
    padding: var(--s-spacing);
    width: 100%
}

.PodcastsListingHero__fallback-image img {
    border-radius: 10px;
    height: auto;
    width: 100%
}

.bg-colour-dark .PodcastsListingHero__featured-container,
.bg-colour-purple-2 .PodcastsListingHero__featured-container {
    background: hsla(0, 0%, 100%, .25)
}

.PodcastsPostHero.TwoColumnBanner .wrapper {
    padding-top: var(--combined-nav-height)
}

.PodcastsPostHero.TwoColumnBanner .TwoColumnBanner__second-column {
    flex-direction: column;
    gap: var(--s-spacing)
}

.PodcastsPostHero__date {
    font-weight: 500
}

.PodcastsPostHero__summary {
    margin-top: var(--s-spacing)
}

.PodcastsPostHero__summary .h6 {
    color: #301b5d
}

.PodcastsPostHero__summary p {
    color: #1d0843
}

.PodcastsPostHero__featured-image {
    width: 100%
}

.PodcastsPostHero__featured-image img {
    aspect-ratio: 16/9;
    border-radius: var(--border-radius);
    height: auto;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%
}

.Guests__container {
    background: var(--element-bg-colour-light);
    border-radius: var(--border-radius);
    display: flex;
    flex-direction: column;
    gap: var(--s-spacing);
    padding: var(--s-spacing)
}

.Guests__heading {
    width: 100%
}

.Guests__logos {
    display: flex;
    flex-direction: column;
    gap: var(--s-spacing);
    width: 100%
}

.Guests__logo-container {
    align-items: center;
    display: flex;
    gap: var(--s-spacing)
}

.Guests__logo {
    height: 70px
}

.Guests__logo img {
    border-radius: 100px;
    height: 70px;
    -o-object-fit: cover;
    object-fit: cover;
    width: 70px
}

.Guests__name {
    font-weight: var(--font-weight-bold)
}

.Guests__position {
    margin-top: .2rem
}

.BlogListing__header .wrapper {
    align-items: flex-end;
    display: flex;
    flex-wrap: wrap;
    gap: var(--m-spacing);
    justify-content: space-between;
    padding-top: var(--m-spacing);
    position: relative;
    z-index: 10
}

.BlogListing__title h1 {
    font-size: var(--font-size-h2);
    line-height: var(--line-height-h2);
    margin: 1rem 0 0
}

.BlogListing__subtitle {
    font-size: var(--font-size-h5);
    margin: 1rem 0 0
}

.BlogListing__filters {
    position: relative;
    width: 100%;
    z-index: 2
}

.BlogListing__grid-wrapper .row {
    padding-bottom: 0
}

.BlogListing__grid {
    grid-gap: var(--m-spacing)
}

.BlogListing__grid .PostCard {
    grid-column: auto/span 2
}

.BlogListing__back-btn {
    color: var(--colour-purple-dark)
}

.BlogListing__back-btn:before {
    background-image: var(--icon-arrow);
    background-position: 50%;
    background-repeat: no-repeat;
    content: "";
    display: inline-block;
    height: 14px;
    margin: 0 .25rem 0 0;
    transform: scale(-1);
    width: 20px
}

.BlogSearch label,
.TopicSelector label {
    font-weight: var(--font-weight-semibold)
}

.BlogSearch {
    position: relative
}

.BlogSearch--podcasts button {
    background-color: var(--colour-green) !important
}

.BlogSearch__form--row {
    display: flex
}

.BlogSearch input {
    border-bottom-right-radius: 0;
    border-right: none;
    border-top-right-radius: 0;
    width: 100%
}

.BlogSearch button {
    background-color: var(--colour-orange);
    border: none;
    border-bottom-right-radius: 5px;
    border-top-right-radius: 5px;
    cursor: pointer;
    height: 50px;
    position: relative;
    transition: all .3s ease-in-out;
    width: 50px
}

.BlogSearch button:after {
    background-image: var(--icon-search);
    content: "";
    height: 20px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: all .3s ease-in-out;
    width: 20px
}

.BlogSearch button:hover {
    background-color: var(--colour-purple-dark)
}

.BlogSearch button:hover:after {
    filter: invert(1)
}

.BlogSearch__suggestions {
    list-style: none;
    margin: 1rem 0 0;
    position: absolute;
    width: 100%;
    z-index: 10
}

.BlogSearch__suggestions li {
    background: var(--colour-white);
    border-left: 1px solid var(--colour-grey);
    border-right: 1px solid var(--colour-grey);
    font-weight: var(--font-weight-semibold);
    padding: 0 !important
}

.BlogSearch__suggestions li a {
    color: var(--colour-purple-dark);
    display: block;
    font-size: var(--font-size-s);
    padding: .25rem .5rem !important;
    width: 100%
}

.BlogSearch__suggestions li:first-child {
    background: var(--colour-purple-dark);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color: var(--colour-white);
    padding: .25rem .5rem !important
}

.BlogSearch__suggestions li:last-child {
    border-bottom: 1px solid var(--colour-grey);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px
}

.BlogSearch__suggestions li:not(:first-child):active,
.BlogSearch__suggestions li:not(:first-child):focus,
.BlogSearch__suggestions li:not(:first-child):focus-visible,
.BlogSearch__suggestions li:not(:first-child):focus-within,
.BlogSearch__suggestions li:not(:first-child):hover {
    background: #e6e6e6
}

.TopicSelector {
    margin: .5rem 0 0
}

.TopicSelector select {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-image: var(--icon-select-arrows);
    background-position: right 1rem top 50%, 0 0;
    background-repeat: no-repeat, repeat;
    background-size: 12px auto, 100%;
    width: 100%
}

.PodcastsListing__grid-header {
    align-items: flex-end;
    display: flex;
    gap: var(--s-spacing);
    justify-content: space-between;
    margin-bottom: calc(var(--m-spacing)*2);
    position: relative;
    z-index: 10
}

.PodcastsListing__grid-header h2 {
    padding-bottom: .3rem
}

.PodcastsListing__grid {
    gap: 3.5rem;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    overflow: visible;
    position: relative
}

.BlogPost--release-notes .BlogPost__header .row {
    padding: var(--vertical-spacing) 0
}

.BlogPost--release-notes .BlogPost__header .BlogPost__subtitle {
    color: var(--colour-heading);
    font-size: var(--font-size-h6);
    font-weight: 500;
    margin-bottom: var(--s-spacing)
}

.BlogPost--release-notes .BlogPost__header .BlogPost__date-info-container {
    align-items: center;
    color: var(--colour-purple-dark);
    display: inline-flex;
    font-weight: 500;
    gap: .5rem;
    margin-top: var(--m-spacing)
}

.BlogPost--release-notes .BlogPost__header .BlogPost__date-pill {
    background: var(--colour-purple-dark);
    border-radius: 100px;
    color: var(--colour-white);
    padding: 0 10px
}

.BlogPost--release-notes .BlogPost__content h1 {
    border: 2px solid var(--colour-error);
    border-radius: 5px;
    padding: .5rem;
    position: relative
}

.BlogPost--release-notes .BlogPost__content h1:after {
    align-items: center;
    background: var(--colour-error);
    border-radius: 0 2px 2px 0;
    bottom: 0;
    color: var(--colour-white);
    content: "h1 not allowed";
    display: flex;
    font-size: 1rem;
    font-weight: 700;
    padding: .5rem;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1
}

.BlogPost--release-notes .BlogPost__content table {
    border: none !important;
    border-collapse: collapse !important;
    margin: .5rem 0 !important;
    width: 100% !important
}

.BlogPost--release-notes .BlogPost__content table tr:nth-child(odd) {
    background: #e1dcf6
}

.BlogPost--release-notes .BlogPost__content table tr:nth-child(2n) {
    background: var(--colour-lavender-light)
}

.BlogPost--release-notes .BlogPost__content table tr:first-child td {
    background: var(--colour-purple-dark);
    color: var(--colour-white);
    font-weight: 700
}

.BlogPost--release-notes .BlogPost__content table tr:first-child td:first-child {
    border-radius: 10px 0 0 0
}

.BlogPost--release-notes .BlogPost__content table tr:first-child td:last-child {
    border-radius: 0 10px 0 0
}

.BlogPost--release-notes .BlogPost__content table tr:first-child td:only-child {
    border-radius: 10px 10px 0 0
}

.BlogPost--release-notes .BlogPost__content table tr:last-child td:first-child {
    border-radius: 0 0 0 10px
}

.BlogPost--release-notes .BlogPost__content table tr:last-child td:last-child {
    border-radius: 0 0 10px 0
}

.BlogPost--release-notes .BlogPost__content table tr:last-child td:only-child {
    border-radius: 0 0 10px 10px
}

.BlogPost--release-notes .BlogPost__content table td {
    border: none !important;
    padding: .5rem 1rem !important
}

.BlogPost__header .TagRow {
    display: none
}

.BlogPost__header .bg-decor-shape-wrapper {
    opacity: .5
}

.BlogPost__header .row {
    align-items: center;
    padding: calc(var(--vertical-spacing)/2) 0
}

.BlogPost__header .BlogPost__first-column {
    width: 47%
}

.BlogPost__header .BlogPost__second-column {
    width: 53%
}

.BlogPost__header .BlogPost__title {
    margin: 1rem 0 0
}

.BlogPost__header .BlogPost__title--reduced-size {
    font-size: var(--font-size-h3)
}

.BlogPost__header .BlogPost__customer-section {
    align-items: center;
    background: var(--colour-lavender-light);
    border-radius: var(--border-radius);
    display: flex;
    flex-wrap: wrap;
    gap: var(--m-spacing);
    margin: 2rem 0 0;
    padding: var(--s-spacing)
}

.BlogPost__header .BlogPost__customer-section .BlogPost__customer-logo {
    align-items: center;
    background: var(--colour-white);
    border-radius: calc(var(--border-radius)/1.2);
    display: flex;
    height: auto;
    justify-content: center;
    padding: calc(var(--s-spacing)/2)
}

.BlogPost__header .BlogPost__customer-section .BlogPost__customer-logo img {
    height: 100%;
    max-height: 80px;
    max-width: 110px;
    -o-object-fit: contain;
    object-fit: contain;
    width: 100%
}

.BlogPost__header .BlogPost__customer-section .BlogPost__customer-info {
    display: flex;
    flex-direction: column;
    gap: calc(var(--s-spacing)/2)
}

.BlogPost__header .BlogPost__customer-section .BlogPost__customer-info p {
    text-wrap: wrap
}

.BlogPost__header .BlogPost__customer-section .BlogPost__customer-info span {
    font-weight: var(--font-weight-semibold)
}

.BlogPost__header .BlogPost__featured-image img {
    aspect-ratio: 16/10;
    border-radius: var(--border-radius);
    height: auto;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%
}

.BlogPost__date {
    font-weight: 500
}

.BlogPost__body-wrapper .row {
    padding: calc(var(--vertical-spacing)/2) 0
}

.RelatedPosts .PostCard__topics {
    display: none
}

.RelatedPosts--reduced-top-padding .row {
    padding-top: calc(var(--vertical-spacing)/2)
}

.RelatedPosts--new .RelatedPosts__title {
    margin-bottom: var(--l-spacing)
}

.RelatedPosts--new .RelatedPosts__articles {
    gap: 3.5rem;
    margin: 0
}

.RelatedPosts__articles {
    gap: var(--m-spacing);
    margin: var(--l-spacing) 0 0
}

.BlogPost__content {
    width: 100%
}

.BlogPost__content .hs_cos_wrapper_type_rich_text>*+* {
    margin: 1em 0
}

.BlogPost__content .hs_cos_wrapper_type_rich_text>*+:last-child {
    margin-bottom: 0
}

.BlogPost__content iframe[src*=youtube] {
    aspect-ratio: 16/9;
    height: auto;
    width: 100%
}

.BlogPost__content .elementor-button,
.BlogPost__content a[role=button] {
    align-items: center;
    background: var(--colour-orange);
    border: 2px solid;
    border-color: var(--colour-orange);
    border-radius: 100px;
    color: var(--button-colour);
    display: inline-flex;
    font-size: var(--font-size-s);
    gap: 13px;
    line-height: 1;
    opacity: 1 !important;
    padding: 11px 22px 11px 18px;
    position: relative;
    text-wrap: nowrap;
    transition: all .3s ease-in-out, scale 0s;
    z-index: 1
}

.BlogPost__content .elementor-button:hover,
.BlogPost__content a[role=button]:hover {
    opacity: 1 !important
}

.BlogPost__content .elementor-button:active,
.BlogPost__content a[role=button]:active {
    scale: .98
}

.BlogPost__content .elementor-button.active,
.BlogPost__content a[role=button].active {
    scale: .94
}

.BlogPost__content .elementor-button:after,
.BlogPost__content a[role=button]:after {
    background: var(--colour-purple-dark);
    border-radius: 100px;
    content: "";
    height: calc(100% + 4px);
    left: -2px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    top: -2px;
    transition: all .35s ease-in-out;
    width: 44px;
    z-index: -1
}

.BlogPost__content #blog-cs-video {
    margin: 0 !important;
    padding-left: 0 !important
}

.BlogPost__content .wistia_embed {
    height: auto !important;
    overflow: hidden
}

.BlogPost__content .wistia_embed,
.BlogPost__content .wistia_embed>div {
    aspect-ratio: 16/9 !important;
    max-width: 100% !important;
    width: 100% !important
}

.BlogPost__content .wistia_embed>div {
    height: 100% !important;
    overflow: hidden !important
}

.BlogPost__content .hs-embed-wrapper,
.BlogPost__content .hs-responsive-embed {
    max-height: none !important;
    max-width: none !important
}

.BlogPost__content .videos {
    padding: 0
}

.System .module {
    background: none
}

.System.System--404 .flow,
.System.System--500 .flow {
    text-align: center
}

input#hs-pwd-widget-password {
    height: auto !important;
    margin: 0 !important
}

.password__prompt {
    text-align: center
}

.password__prompt .hs_cos_wrapper_type_rich_text>*+* {
    margin: 1em 0 0
}

.password__prompt form {
    margin: 2em auto;
    max-width: 480px
}

.password__prompt form input {
    background: var(--colour-white);
    border: 1px solid var(--colour-grey);
    border-radius: 5px;
    padding: 12px 16px;
    width: 100%
}

.password__prompt form .hs-button.primary.large {
    background: var(--colour-purple-dark);
    border: none;
    color: #fff;
    cursor: pointer;
    font-weight: var(--font-weight-semibold);
    margin: 1em 0 0;
    outline: none;
    padding: 12px 16px;
    transition: all .3s ease-in-out
}

.password__prompt form .hs-button.primary.large:hover {
    background: var(--colour-black)
}

.hs-search-highlight {
    color: var(--colour-lavender);
    font-weight: var(--font-weight-bold)
}

.hs-search-results__listing {
    display: grid;
    grid-gap: var(--m-spacing)
}

.hs-search-results__description {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.hs-search-results__pagination {
    display: flex;
    gap: .5rem;
    justify-content: center;
    margin: 2rem 0 0
}

.hs-search-results__pagination-pages {
    align-items: center;
    display: flex;
    gap: .5rem;
    justify-content: center
}

.hs-search-results__pagination-pages>* {
    align-items: center;
    aspect-ratio: 1/1;
    border-radius: 100px;
    color: var(--button-colour);
    display: flex;
    font-size: var(--font-size-s);
    justify-content: center;
    -webkit-text-decoration: underline;
    text-decoration: underline;
    transition: all .3s ease-in-out;
    width: 36px
}

.hs-search-results__pagination-pages>:hover {
    opacity: 1
}

.hs-search-results__pagination-pages>.pagination-page-active,
.hs-search-results__pagination-pages>:hover {
    background: var(--colour-purple-dark);
    color: var(--colour-white)
}

.hs-search-results__next-page.enabled,
.hs-search-results__prev-page.enabled {
    border: 2px solid var(--colour-purple-dark);
    border-radius: 100px;
    color: var(--colour-purple-dark);
    line-height: 125% !important;
    padding: 8px 16px;
    transition: all .3s ease-in-out
}

.hs-search-results__next-page.enabled:hover,
.hs-search-results__prev-page.enabled:hover {
    background: var(--colour-purple-dark);
    color: var(--colour-white);
    opacity: 1
}

.search-results__header {
    display: flex;
    flex-direction: column;
    gap: var(--m-spacing);
    width: 100%
}

.search-results__title {
    font-size: var(--font-size-h2);
    line-height: var(--line-height-h2)
}

.search-results__results-container {
    margin-top: var(--vertical-spacing)
}

@media (min-width:430px) {
    :root {
        --font-size-h6: clamp(1.13rem, 0.13vw + 1.09rem, 1.25rem);
        --font-size-h5: clamp(1.27rem, 0.32vw + 1.18rem, 1.56rem);
        --font-size-h4: clamp(1.42rem, 0.57vw + 1.27rem, 1.95rem);
        --font-size-h3: clamp(1.6rem, 0.9vw + 1.36rem, 2.44rem);
        --font-size-h2: clamp(1.8rem, 1.34vw + 1.44rem, 3.05rem);
        --font-size-h1: clamp(2.03rem, 1.92vw + 1.51rem, 3.81rem);
        --font-size-xl: clamp(2.28rem, 2.67vw + 1.56rem, 4.77rem);
        --font-size-xxl: clamp(2.57rem, 3.65vw + 1.59rem, 5.96rem)
    }
}

@media (min-width:550px) {

    .HubGrid,
    .PodcastsListing__grid {
        gap: 4rem 1.5rem;
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .RelatedPosts--new .RelatedPosts__articles {
        gap: 4rem 1.5rem
    }
}

@media (min-width:680px) {
    .CTAStrip--container {
        padding: 2rem
    }

    .Footer--menus {
        gap: 4rem var(--menu-spacing);
        grid-template-columns: repeat(auto-fit, minmax(calc((var(--wrapper) - var(--intro-width))/5 - var(--menu-spacing)*2 - var(--margin)/2), 1fr))
    }
}

@media (min-width:768px) {
    :root {
        --vertical-spacing: 4rem;
        --s-spacing: 1.2rem;
        --m-spacing: 1.5rem;
        --l-spacing: 2.1rem;
        --xl-spacing: 3rem
    }

    .grid--cols-2,
    .grid--cols-4,
    .slider-container--simplified .slider-wrapper {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .slider-container--simplified--post-row .slider-wrapper {
        grid-template-columns: none
    }

    .LogoRow__container {
        gap: 4rem var(--logo-gap)
    }

    .LogoRow__logo-wrapper--max-3-per-row,
    .LogoRow__logo-wrapper--max-4-per-row,
    .LogoRow__logo-wrapper--max-5-per-row {
        flex: 0 0 calc(33.33333% - var(--logo-gap))
    }

    .LogoRow__logo-wrapper img {
        height: 100%;
        max-height: 80px;
        max-width: 150px;
        padding: 0;
        width: 100%
    }

    .sidebar-wrapper {
        display: grid;
        grid-gap: var(--m-spacing);
        grid-template-columns: 1fr 3fr
    }

    .sidebar-wrapper--blog-post .sidebar-left-side-modules {
        margin: 0
    }

    .Accordion__items--inside-hotspot-area {
        display: none
    }

    .CaseStudyTabItem--top {
        display: flex
    }

    .SectionTitle--centre {
        margin: 0 auto;
        text-align: center
    }

    .SectionTitle--centre * {
        text-align: center
    }

    .SectionTitle--centre .ButtonRow {
        justify-content: center
    }

    .TwoColumnBanner--benefits .TwoColumnBanner--grid {
        gap: 2rem var(--xl-spacing);
        grid-template-columns: 44fr 56fr
    }

    .TeamModal--container {
        max-width: 800px
    }

    .Recommendations--row {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }
}

@media (min-height:800px),
(min-width:1440px) {
    .MenuOverview {
        padding: .5rem
    }

    .MenuOverview__icon {
        display: grid;
        height: 3rem;
        width: 3rem
    }

    .MenuOverview__text,
    .MenuOverview__text p {
        font-size: 13px
    }

    .MenuOverview__link {
        font-size: 14px
    }

    .MenuOverview .MenuList__menu {
        margin: 1rem 0 0
    }

    .MenuOverview .MenuList__link {
        font-size: 14px
    }

    .MenuCTA {
        border-radius: 1rem;
        padding: 1.5rem
    }
}

@media (min-width:992px) {

    .Button--full.Button--xl a,
    .Button--full.Button--xl button {
        font-size: var(--font-size-h5);
        padding: 15px 34px
    }

    .Button--full.Button--xl a svg,
    .Button--full.Button--xl button svg {
        height: 1.5rem;
        width: 1.5rem
    }

    .Button--full.Button--l a,
    .Button--full.Button--l button {
        font-size: 18px;
        gap: 1rem;
        padding: 10px 28px
    }

    .Button--full.Button--l a svg,
    .Button--full.Button--l button svg {
        height: 1.2rem;
        width: 1.2rem
    }

    .grid--cols-3,
    .slider-container--simplified--post-row .slider-wrapper {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .Pagination--new {
        gap: 2rem
    }

    .Pagination--new .Pagination__info {
        font-size: var(--font-size-base)
    }

    .NewPostCard__text {
        padding: .5rem 0 0
    }

    .NewPostCard__date {
        margin: 0 0 1.75rem
    }

    .NewPostCard__button {
        margin: 2rem 0 0
    }

    .NewPostCard__button a {
        gap: 1.5rem
    }

    .NewPostCard__button a:after {
        --icon-size: 2rem
    }

    .CaseStudyTab__logo {
        padding: .75rem
    }

    .CaseStudyTab__logo img {
        height: 100%;
        max-width: 140px;
        width: auto
    }

    .CaseStudyTabItem--middle-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .CaseStudyTabItem--bottom {
        grid-template-columns: 1fr 3fr
    }

    .CaseStudyTabItem__solution-title {
        font-size: 14px
    }

    .CaseStudyTabItem--stats {
        align-items: flex-start;
        display: flex;
        gap: 1rem
    }

    .CTAStrip--container {
        padding: 3rem
    }

    .Footer--middle {
        gap: var(--l-spacing);
        grid-template-columns: var(--intro-width) 1fr
    }

    .FilterInsights__menu {
        max-width: 340px
    }

    .HubHeader__quick-link {
        font-size: 14px;
        padding: .25rem 1rem
    }

    .HubFeed {
        gap: 3rem;
        grid-template-columns: minmax(280px, 1fr) 3fr
    }

    .HubGrid--cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important
    }

    .HubGrid__ui {
        gap: 2rem;
        justify-content: flex-start;
        padding: 1rem 0 2rem
    }

    .Hub__showing {
        font-size: var(--font-size-base);
        opacity: 1
    }

    .Hub .Card__text {
        padding: .5rem 0 0
    }

    .Hub .Card__date {
        margin: 0 0 2rem
    }

    .Hub .Card__button {
        margin: 2rem 0 0
    }

    .Hub .Card__button a {
        gap: 1.5rem
    }

    .Hub .Card__button a:after {
        --icon-size: 2rem
    }

    .HubPrompts--row {
        gap: 1rem;
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

    .HubPromptsItem:hover {
        background: var(--colour-lavender-light);
        border-color: var(--colour-lavender);
        box-shadow: var(--box-shadow);
        opacity: 1;
        transform: translateY(-.25rem)
    }

    .HubPromptsItem__title {
        font-size: var(--font-size-base)
    }

    .LogoCarouselItem {
        padding: 2.25rem 2rem
    }

    .LogoCarouselItem__text {
        font-size: var(--font-size-h6);
        line-height: 140%
    }

    .LogoCarouselItem--linked {
        gap: 20px;
        grid-template-columns: 220px 300px;
        width: 580px
    }

    .LogoCarouselItem__image {
        align-content: center;
        display: grid;
        justify-content: center;
        place-content: center
    }

    .LogoCarouselItem__image img {
        max-height: 80px;
        max-width: 140px
    }

    .LogoCarouselItem__button {
        font-size: var(--font-size-base)
    }

    .TwoColumnBanner__text-column-bottom-container--mobile {
        display: none
    }

    .TabbedContent__tab-content {
        grid-template-columns: 47fr 53fr
    }

    .TabbedContent__tab-content--single-column {
        grid-template-columns: 1fr !important
    }

    .TabbedContent__tab-content--single-column .TabbedContent__text-column {
        grid-column: span 2/span 2;
        justify-self: center;
        width: 47%
    }

    .Recommendations {
        grid-column: span 2/span 2;
        padding: 2rem
    }

    .Recommendations__title {
        font-size: var(--font-size-s)
    }

    .Recommendations__title:before {
        background: var(--star-icon);
        background-position: 50%;
        background-repeat: no-repeat;
        background-size: contain;
        content: "";
        height: 1.25rem;
        width: 1.25rem
    }

    .RecommendationsItem {
        --icon-size: 3.5rem
    }

    .ComparisonTable .custom-grid--cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .ComparisonTable .custom-grid--cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .ComparisonTable .custom-grid--cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

    .ComparisonTable__hot-top-features {
        display: none
    }

    .BlogListing__title h1 {
        font-size: var(--font-size-h1);
        line-height: var(--line-height-h1)
    }

    .PodcastsListing__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }
}

@media (min-width:992px) and (max-width:1099px) {
    .CaseStudyTabItem__quote-text {
        font-size: 1.2rem !important
    }
}

@media (min-width:996px) {
    .PostCard {
        height: 400px
    }

    .BlogListing__filters {
        display: flex;
        flex-wrap: wrap;
        gap: var(--m-spacing);
        width: auto
    }

    .BlogListing__grid {
        grid-template-columns: repeat(4, 1fr)
    }

    .BlogSearch--podcasts input {
        width: 350px !important
    }

    .BlogSearch input {
        width: 250px
    }

    .TopicSelector {
        margin: 0
    }

    .TopicSelector select {
        width: 250px
    }

    .hs-search-results__listing {
        grid-template-columns: repeat(2, 1fr)
    }

    .search-results__header {
        align-items: end;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between
    }

    .search-results__title {
        font-size: var(--font-size-h1);
        line-height: var(--line-height-h1)
    }
}

@media (min-width:1024px) {
    .SidebarBP__share {
        justify-content: space-between
    }
}

@media (min-width:1025px) {
    .LogoRow__logo-wrapper--max-4-per-row {
        flex: 0 0 calc(25% - var(--logo-gap))
    }

    .LogoRow__logo-wrapper--max-5-per-row {
        flex: 0 0 calc(20% - var(--logo-gap))
    }

    .LogoRow__logo-wrapper--max-6-per-row {
        flex: 0 0 calc(16.66667% - var(--logo-gap))
    }
}

@media (min-width:1080px) {
    .grid--cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

    .HubGrid--cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important
    }
}

@media (min-width:1100px) and (max-width:1199px) {
    .CaseStudyTabItem__quote-text {
        font-size: 1.35rem !important
    }
}

@media (min-width:1200px) and (max-width:1279px) {
    .CaseStudyTabItem__quote-text {
        font-size: 1.5rem !important
    }
}

@media (min-width:1280px) {
    :root {
        --margin: 2rem;
        --vertical-spacing: 6rem;
        --s-spacing: 1.5rem;
        --m-spacing: 2rem;
        --l-spacing: 3rem;
        --xl-spacing: 4.5rem;
        --secondary-nav-height: 40px;
        --nav-logo-height: 36px
    }

    #main-content:after {
        background: var(--colour-purple-dark);
        content: "";
        height: 100vh;
        left: 0;
        opacity: 0;
        pointer-events: none;
        position: fixed;
        top: 0;
        transition: opacity .32s ease;
        width: 100vw;
        z-index: 1000
    }

    .NewPostCard__title {
        font-size: var(--font-size-h6)
    }

    .HubGrid {
        gap: 4.5rem 2rem
    }

    .Hub .Card__title {
        font-size: var(--font-size-h6)
    }

    .Nav__psa {
        display: block
    }

    .Nav__secondary-menu ul {
        gap: var(--menu-gap)
    }

    .Nav__secondary--right {
        justify-content: flex-end;
        width: auto
    }

    .Nav__secondary,
    .Nav__secondary * {
        font-size: 14px
    }

    .Nav__secondary-grid {
        gap: var(--menu-gap);
        grid-template-columns: 1fr auto
    }

    .Nav--container {
        display: block;
        height: auto;
        left: auto;
        max-height: none;
        min-height: 0;
        opacity: 1;
        overflow-y: visible;
        pointer-events: all;
        top: auto;
        width: auto;
        z-index: 1000
    }

    .Nav--container,
    .NavMenu {
        background: none;
        padding: 0;
        position: relative
    }

    .NavMenu {
        border-radius: none;
        gap: var(--menu-gap)
    }

    .NavMenu,
    .NavMenu--row {
        align-items: center;
        display: flex
    }

    .NavMenu--row {
        position: relative
    }

    .NavMenu--highlight {
        background-color: var(--colour-lavender-light);
        border-radius: 2rem;
        bottom: 0;
        display: block;
        height: 100%;
        left: 0;
        opacity: 0;
        pointer-events: none;
        position: absolute;
        transform: translateZ(0);
        transition: opacity .32s ease, width .32s ease, transform .32s ease;
        width: 0;
        will-change: transform, opacity, width;
        z-index: 0
    }

    .NavActions {
        background: none;
        padding: 0
    }

    .NavItem--parent:after {
        background: #fff;
        border-radius: 2px;
        content: "";
        display: block;
        height: 1.5rem;
        left: 50%;
        opacity: 0;
        pointer-events: none;
        position: absolute;
        top: calc(100% + 2.5rem);
        transform: rotate(45deg) translate(-50%);
        width: 1.5rem;
        z-index: 0
    }

    .NavItem:nth-last-child(-n+2) .SubMenu--cols-1,
    .NavItem:nth-last-child(-n+2) .SubMenu--cols-2 {
        right: -4rem;
        transform: translateX(0)
    }

    .NavLink {
        padding: 4px 1.25rem
    }

    .NavLink:before {
        content: "";
        height: calc(100% + 2rem);
        left: 50%;
        pointer-events: none;
        position: absolute;
        top: 100%;
        transform: translate(-50%);
        width: calc(100vw - var(--margin)*2);
        z-index: 1
    }

    .NavLink__chevron {
        display: none
    }

    .SubMenu {
        display: grid;
        max-width: var(--wrapper);
        opacity: 0;
        padding: 0 var(--margin);
        pointer-events: none;
        position: fixed;
        right: 50%;
        top: calc(var(--combined-nav-height) + 1.25rem);
        transform: translateX(50%);
        width: 100%;
        z-index: 1
    }

    .SubMenu--grid {
        background: var(--colour-white);
        border-radius: 20px;
        box-shadow: 0 1rem 2rem rgba(0, 0, 0, .24), 0 1px 1px rgba(0, 0, 0, .1);
        gap: 1.25rem 1.75rem;
        grid-template-columns: repeat(var(--sub-cols), minmax(0, 1fr));
        max-height: calc(100vh - var(--combined-nav-height) - 2rem);
        overflow-y: auto;
        padding: 1rem
    }

    .SubMenu--cols-1,
    .SubMenu--cols-2 {
        padding: 0;
        position: absolute;
        top: calc(100% + var(--nav-height) - 1.9rem)
    }

    .SubMenu--cols-1 {
        width: calc(var(--wrapper)/4)
    }

    .SubMenu--cols-2 {
        width: calc(var(--wrapper)/2)
    }

    .SubMenu--cols-3 {
        max-width: calc(var(--wrapper) - 300px);
        width: 100%
    }

    .MenuCard--linked:hover .MenuCard__graphic {
        opacity: .9;
        transform: scale(1.05)
    }

    .MenuCard--linked .MenuCard__content:hover {
        opacity: 1
    }

    .MenuCard__graphic {
        --graphic-scale: 380px
    }

    .MenuCard__content {
        max-width: 380px;
        padding-top: min(20vmin, 16rem)
    }

    .MenuList__menu>*+* {
        margin: 1rem 0 0
    }

    .MenuList__menu:hover a {
        opacity: .4
    }

    .MenuList__menu:hover a:hover {
        opacity: 1
    }

    .MenuList__menu:hover a:hover:after {
        opacity: 1;
        transform: none
    }

    .MenuList__link {
        font-size: 16px
    }

    .MenuSubtitled__item:hover {
        opacity: 1 !important
    }

    .MenuSubtitled__item:hover .MenuSubtitled__title:after {
        opacity: 1;
        transform: none
    }

    .MenuSubtitled__item:hover:before {
        filter: none;
        opacity: 1;
        transform: translate(-50%, -50%)
    }

    .MenuOverview--linked:before {
        background: var(--colour-lavender-light);
        border-radius: .5rem;
        content: "";
        filter: blur(10px);
        height: calc(100% + 1.25rem);
        left: 50%;
        opacity: 0;
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%) scale(.9);
        transition: all .32s ease;
        width: calc(100% + 1.5rem);
        z-index: 0
    }

    .MenuOverview--linked:hover .MenuOverview__icon {
        background: var(--colour-white)
    }

    .MenuOverview--linked:hover:before {
        filter: none;
        opacity: 1;
        transform: translate(-50%, -50%)
    }

    .MenuOverview__title {
        font-size: 11px;
        margin: 1.25rem 0 0
    }

    .MenuOverview__link {
        font-size: 13px
    }

    .MenuFeed__post:hover {
        opacity: 1
    }

    .MenuFeed__post:hover .MenuFeed__image img {
        transform: scale(1.1)
    }

    .MenuFeed__post:hover .MenuFeed__post-title {
        color: var(--colour-lavender)
    }

    .MenuFeed__post--grid {
        gap: .75rem;
        grid-template-columns: 80px 1fr;
        padding-right: .5rem
    }

    .MenuFeed__image {
        aspect-ratio: 16/10
    }

    .MenuFeed__post-title {
        font-size: 13px
    }

    .MenuFeed__tags {
        align-items: center;
        display: flex;
        gap: 2px;
        margin: 0 0 8px
    }

    .MenuFeed__tag {
        background: var(--colour-lavender-light);
        border-radius: 1rem;
        color: var(--colour-purple-dark);
        font-size: 11px;
        line-height: 120%;
        padding: .25rem .5rem
    }

    .MenuCTA {
        grid-column: span var(--sub-cols)/span var(--sub-cols)
    }

    .MenuCTA__logo {
        width: 128px
    }

    .LanguageToggle__link:hover {
        transform: translateY(-1px)
    }

    .LanguageToggle__link--current:hover {
        transform: none
    }

    .Nav__toggle {
        display: none
    }

    .TwoColumnBanner__second-column .TwoColumnBanner__step-icon img {
        height: 40px;
        width: 40px
    }

    .TeamModal--container {
        height: calc(100% - var(--combined-nav-height))
    }

    .BlogListing__grid {
        grid-template-columns: repeat(6, 1fr)
    }

    .PodcastsListing__grid,
    .RelatedPosts--new .RelatedPosts__articles {
        gap: 4.5rem 2rem
    }
}

@media (min-width:1280px) and (max-width:1439px) {

    .SubMenu--cols-3,
    .SubMenu--cols-4,
    .SubMenu--cols-5 {
        max-width: calc(100% - 1.25rem)
    }
}

@media (min-width:1280px) and (min-width:1280px) {
    .Nav__main--hover {
        background: var(--colour-background)
    }

    .NavItem--parent:hover .SubMenu {
        opacity: 1;
        pointer-events: all
    }

    .NavItem--parent:hover:after {
        animation: fadeInUp .32s ease .32s forwards
    }

    @keyframes fadeInUp {
        0% {
            opacity: 0;
            transform: rotate(45deg) translate(-50%) scale(.5)
        }

        to {
            opacity: 1;
            transform: rotate(45deg) translate(-50%) scale(1)
        }
    }

    .NavLink:hover {
        opacity: 1
    }

    .NavLink:hover:before {
        pointer-events: all
    }
}

@media (min-width:1440px) {
    :root {
        --margin: max(1rem, min(5vw, 6rem))
    }

    .HubPagination Button,
    .Pagination--new .Pagination__buttons button a {
        font-size: 16px
    }

    .SubMenu--grid {
        padding: 1.25rem
    }

    .MenuOverview__text {
        margin: .75rem 0 0;
        max-width: 320px
    }

    .MenuOverview__text h2,
    .MenuOverview__text h3,
    .MenuOverview__text h4,
    .MenuOverview__text h5,
    .MenuOverview__text h6 {
        font-size: 18px
    }

    .MenuCTA__logo {
        width: 150px
    }

    .TeamModal__portrait img {
        height: 128px;
        width: 128px
    }

    .TeamModal .TeamCard__member-name {
        font-size: var(--font-size-h5)
    }
}

@media (min-width:1441px) {
    .BlogListing__grid .PostCard.PostCard--primary {
        grid-column: auto/span 6
    }

    .BlogListing__grid .PostCard.PostCard--secondary {
        grid-column: auto/span 4
    }
}

@media (min-width:1512px) {
    .MenuFeed__post--grid {
        gap: 1rem;
        grid-template-columns: 140px 1fr
    }

    .MenuFeed__post-title {
        font-size: 14px
    }

    .MenuCTA__text {
        font-size: 18px
    }
}

@media (min-width:1680px) {
    .PostCard {
        height: 500px
    }

    .sidebar-wrapper--blog-post {
        grid-template-columns: 1fr 2.5fr 1fr
    }

    .TeamModal__portrait img {
        height: 160px;
        width: 160px
    }
}

@media (min-width:1728px) {
    .ImageCta--container {
        margin: 2rem 0
    }

    .ImageCta__bg-image {
        border-radius: var(--border-radius)
    }
}

@media (min-width:1920px) {
    .MenuList__link {
        font-size: 18px
    }
}

@media (max-width:400px),
(min-device-width:320px) and (max-device-width:480px) {

    .HubSpotForm form.hs-form:not(.hs-video-form) .form-columns-1 .hs-form-field.field .hs-input,
    .HubSpotForm form.hs-form:not(.hs-video-form) .form-columns-2 .hs-form-field.field .hs-input,
    .HubSpotForm form.hs-form:not(.hs-video-form) .form-columns-3 .hs-form-field.field .hs-input {
        width: 100%
    }
}

@media (max-width:1439px) {
    .NavMenu--items-6 .NavItem:first-child .SubMenu {
        left: -100%;
        right: auto;
        transform: none
    }
}

@media (max-width:1300px) {
    .ButtonList__card--icon {
        max-width: 52%
    }
}

@media (max-width:1280px) {

    .ImageHotspotArea .Hotspot,
    .ImageHotspotArea .Hotspot__outer {
        height: 50px;
        width: 50px
    }

    .ImageHotspotArea .Hotspot__inner {
        height: 35px;
        width: 35px
    }

    .ImageHotspotArea .Hotspot__icon {
        height: 20px;
        width: 20px
    }

    .ImageHotspotArea .Hotspot__message {
        left: 80px;
        width: 300px
    }

    .ImageHotspotArea .Hotspot__message p {
        font-size: var(--font-size-s)
    }

    .ImageHotspotArea .Hotspot__message--move-down:before {
        top: 53px !important
    }

    .ImageHotspotArea .Hotspot__message--flipped-left {
        right: 80px !important
    }

    .ImageHotspotArea .Hotspot__message--flipped-bottom {
        top: 80px !important
    }
}

@media (max-width:1279px) {
    .slider-slide {
        min-width: 50%
    }

    .slider-slide--post-card {
        min-width: 33.33%
    }

    .slider-slide--post-card--active {
        min-width: 49.995%
    }

    .HubHeader__UI {
        display: flex;
        flex-direction: column-reverse
    }

    .Nav--active {
        background: var(--colour-white)
    }

    .Nav--active .Nav--container {
        opacity: 1;
        pointer-events: all
    }

    .NavMenu {
        background: var(--colour-white);
        border-radius: 1rem;
        display: grid;
        max-width: 580px;
        overflow: hidden;
        width: 100%
    }

    .NavMenu--row {
        order: 2;
        padding: 1rem
    }

    .NavMenu--row>*+* {
        border-top: 1px solid var(--colour-lavender-light)
    }

    .NavItem--parent,
    .NavItem--parent .NavLink--unlinked {
        cursor: pointer
    }

    .NavItem--active .NavLink__label {
        color: var(--colour-lavender)
    }

    .NavItem--active .SubMenu {
        display: grid
    }

    .NavItem--active .NavLink__chevron {
        background-color: var(--colour-lavender);
        transform: rotate(0)
    }

    .NavLink--root {
        width: 100%
    }

    .NavLink__label {
        align-items: center;
        display: flex;
        gap: 1rem;
        justify-content: space-between;
        padding: .5rem 0;
        width: 100%
    }

    .SubMenu--grid>* {
        box-shadow: 0 0 2rem rgba(0, 0, 0, .16), 0 1px 1px rgba(0, 0, 0, .1)
    }

    .SubMenu--grid>:not(.MenuCard):not(.MenuCTA) {
        border: 1px solid var(--colour-lavender-light);
        border-radius: 12px;
        padding: 1rem
    }

    .MenuCard {
        display: none
    }

    .MenuCard--linked {
        display: grid
    }

    .MenuOverview__icon {
        height: 1.5rem;
        width: 1.5rem
    }

    .MenuOverview__text {
        border-bottom: 1px solid var(--colour-lavender-light);
        margin: .5rem 0 0;
        padding: 0 0 1rem;
        width: 100%
    }

    .MenuFeed__posts {
        gap: 1rem
    }

    .MenuFeed__posts>*+* {
        border-top: 1px solid var(--colour-lavender-light);
        padding: 1rem 0 0
    }

    .MenuFeed__details {
        max-height: 56px
    }

    .ScrollCard {
        --pin-start: calc(var(--nav-height) + var(--m-spacing)/2);
        --title-height: calc(var(--l-spacing) + var(--s-spacing) + 0.5rem);
        padding: var(--s-spacing)
    }

    .ScrollCard__title {
        padding-bottom: var(--s-spacing)
    }

    .ScrollCard__title h3 {
        font-size: var(--font-size-h4)
    }

    .ScrollCard__number {
        font-size: var(--font-size-h6)
    }

    .ScrollCard__icon img {
        min-width: var(--m-spacing);
        width: var(--m-spacing)
    }

    .ScrollCard__content {
        margin-top: var(--s-spacing)
    }

    .ScrollCard__text h1,
    .ScrollCard__text h2,
    .ScrollCard__text h3,
    .ScrollCard__text h4,
    .ScrollCard__text h5,
    .ScrollCard__text h6 {
        font-size: var(--font-size-h5)
    }

    .ImageHotspotArea__content-container {
        max-width: var(--container-max-width)
    }

    .TLBanner--hero-2 .TLBanner__container {
        align-items: flex-start;
        flex-direction: column;
        gap: calc(var(--m-spacing)/2)
    }

    .TLBanner--hero-2 .TLBanner__logos {
        justify-content: flex-start
    }
}

@media (max-width:1199px) {
    .Calc__gate-form {
        width: 60%
    }

    .ImageHotspotArea__gate-form {
        width: 75%
    }
}

@media (max-width:1100px) {
    .CardComponent--horizontal {
        flex-direction: column
    }

    .ButtonList__list .Button__wrapper .Button:hover .ButtonList__card--icon {
        transform: translateX(-50px)
    }

    .ButtonList__card--icon {
        max-width: 50%;
        transform: translateX(-200px)
    }
}

@media (max-width:995px) {
    .PodcastsListing.BlogListing .BlogListing__filters {
        max-width: 450px;
        width: 100%
    }

    .PodcastsListing__grid-header {
        align-items: flex-start;
        flex-direction: column
    }
}

@media (max-width:992px) {
    .ScrollCards__heading {
        text-align: left
    }
}

@media (max-width:991px) {

    .bg-decor-shape-wrapper--form-module svg,
    .bg-decor-shape-wrapper--hero-tabs-1 svg,
    .bg-decor-shape-wrapper--hero-tabs-2 svg {
        opacity: .35
    }

    .bg-decor-shape-wrapper--hide-on-mobile {
        display: none
    }

    .flex {
        flex-direction: column
    }

    .flex--reverse-mobile {
        flex-direction: column-reverse
    }

    .stick-to-wrapper-left,
    .stick-to-wrapper-right {
        width: calc(100% + var(--margin) + var(--border-radius)) !important
    }

    .slider-slide {
        min-width: 75%
    }

    .slider-slide--post-card {
        min-width: 50%
    }

    .slider-slide--post-card--active {
        min-width: 65%
    }

    .FormComponent__inner {
        grid-column: span 2
    }

    .FormComponent__image {
        display: none
    }

    .Accordion__container {
        width: 100%
    }

    .Calc__container--not-gated {
        padding-right: 0
    }

    .Calc__header {
        flex-direction: column;
        gap: var(--s-spacing)
    }

    .Calc .SmallDivider--not-gated {
        margin-right: var(--l-spacing);
        width: calc(100% - var(--l-spacing)*2)
    }

    .Calc__gate-form {
        width: 90%
    }

    .Calc__sub-heading--transformed {
        transform: translateX(-30%)
    }

    .Calc__sub-heading .go-back {
        margin-left: 30%
    }

    .Calc__main-content--gated {
        flex-direction: column
    }

    .Calc__main-content--not-gated {
        margin-bottom: var(--l-spacing);
        overflow: visible;
        overflow: initial;
        transition: none;
        width: 200%
    }

    .Calc__main-content--transformed {
        transform: translateX(-50%)
    }

    .Calc__sliders--gated {
        padding-bottom: var(--l-spacing);
        padding-right: 0;
        width: 100%
    }

    .Calc__sliders--not-gated {
        margin-bottom: none;
        padding-right: var(--l-spacing);
        width: 100%
    }

    .Calc__results-wrapper {
        width: 100%
    }

    .Calc__results-wrapper--not-gated--desktop {
        display: none
    }

    .Calc__results-wrapper--not-gated--mobile {
        display: block
    }

    .Calc__calculation {
        font-size: var(--font-size-h3)
    }

    .Calc__calculation--highlight {
        font-size: var(--font-size-h2)
    }

    .Calc__calc-label {
        font-size: var(--font-size-base)
    }

    .Calc__results-cta {
        padding: calc(var(--m-spacing)/2) var(--s-spacing)
    }

    .Calc__get-results-form {
        padding-left: var(--l-spacing);
        padding-right: var(--l-spacing);
        width: 100%
    }

    .Calc__debug-data--not-gated {
        margin-right: var(--l-spacing)
    }

    .FeatureTabs--grid {
        grid-template-columns: 1fr
    }

    .FeatureTabs--media {
        display: none
    }

    .Hub--release-notes .HubFilters__menus {
        max-height: 400px
    }

    .HubHeader__quick-filter {
        display: none
    }

    .TwoColumnBanner__text-column {
        width: 100%
    }
    .login-link:hover {
        border-bottom: unset !important;
        text-decoration: underline !important;
    }

    #youtube-iframe {
        width: 100% !important;
    }

    .TwoColumnBanner__container {
        align-items: unset !important;
    }

    #journey {
        background: transparent !important;
    }

    #journey h2 {
        color: #161715 !important;
    }

    #journey p {
        color: #161715 !important;
    }

    .bg-colour-lavender_white {
        --module-background-gradient: unset !important;
    }

    .TwoColumnBanner__second-column img {
        height: auto !important;
        border-radius: unset !important;
    }

    .TwoColumnBanner__second-column--placeholder,
    .TwoColumnBanner__text-column-bottom-container--desktop {
        display: none
    }

    .TabbedContent__second-column,
    .TabbedContent__text-column,
    .TwoColumnBanner__second-column {
        width: 100%
    }

    .StickyFeature__container {
        flex-direction: row
    }

    .HeroFeatureTabs__cards {
        background: none;
        margin-top: calc(var(--m-spacing)*-1)
    }

    .HeroFeatureTabsItem {
        padding: var(--s-spacing)
    }

    .CardsGrid__container {
        flex-direction: row
    }

    .CardsGrid__container--reverse {
        flex-direction: row-reverse
    }

    .CardsGrid .Cards__container {
        grid-template-columns: 1fr
    }

    .CardsGrid__video--mobile {
        display: block
    }

    .CardsGrid__video--desktop {
        display: none
    }

    .ButtonList__list {
        gap: calc(var(--s-spacing)/2)
    }

    .ButtonList__list .Button__wrapper .Button:hover .ButtonList__card {
        transform: translateX(0)
    }

    .ButtonList__card {
        max-width: 50%;
        transform: translateX(-150px)
    }

    .ButtonList__icon,
    .ButtonList__image {
        display: none
    }

    .ImageHotspotArea__gate-form {
        width: 90%
    }

    .ComparisonTable__card-heading--hidden-on-mobile,
    .ComparisonTable__features-title {
        display: none
    }

    .ComparisonTable__recommended-label {
        align-self: flex-start;
        position: static;
        transform: none
    }

    .ComparisonTable__card-title {
        align-self: flex-start
    }

    .ComparisonTable__card-title-logo {
        width: 50%
    }

    .ComparisonTable__button-container,
    .ComparisonTable__features {
        display: none !important
    }

    .SubscriptionForm__container,
    .TLBanner--hero,
    .TLBanner__container {
        align-items: flex-start;
        flex-direction: column;
        gap: var(--s-spacing)
    }

    .TLBanner__logos {
        justify-content: flex-start !important
    }

    .BlogPost__header .BlogPost__meta-data,
    .BlogPost__header .BlogPost__second-column {
        width: 100%
    }
}

@media (max-width:768px) {
    .SectionTitle--two-column {
        grid-template-columns: 1fr
    }
}

@media (max-width:767px) {

    .bg-decor-shape-wrapper svg,
    .bg-decor-shape-wrapper--hero-podcasts svg {
        opacity: .35
    }

    .bg-decor-shape-wrapper--hero-podcasts-dark svg {
        opacity: .15
    }

    .BulletRow {
        gap: .5rem
    }

    .BulletRow .Bullet {
        height: 10px;
        width: 10px
    }

    .slider-slide {
        min-width: 80%
    }

    .HubSpotForm form.hs-form fieldset.form-columns-1 {
        grid-template-columns: 1fr
    }

    .HubSpotForm form.hs-form fieldset.form-columns-1 .hs-richtext.hs-main-font-element {
        grid-column: span 1
    }

    .HubSpotForm form.hs-form fieldset.form-columns-2 {
        grid-template-columns: 1fr
    }

    .HubSpotForm form.hs-form fieldset.form-columns-2 .hs-richtext.hs-main-font-element {
        grid-column: span 1
    }

    .HubSpotForm form.hs-form fieldset.form-columns-3 {
        grid-template-columns: 1fr
    }

    .HubSpotForm form.hs-form fieldset.form-columns-3 .hs-richtext.hs-main-font-element {
        grid-column: span 1
    }

    .SidebarBP--release-notes .SidebarBP__table-of-contents {
        display: none
    }

    .Calc__gate-form {
        width: 96%
    }

    .Calc__gate-form .h3 {
        font-size: var(--font-size-base) !important
    }

    .Calc__sub-heading--transformed {
        transform: translateX(0)
    }

    .Calc__sub-heading h2 {
        font-size: var(--font-size-h6) !important;
        line-height: var(--line-height-h6) !important
    }

    .Calc__sub-heading .go-back {
        gap: var(--s-spacing);
        margin-left: 0
    }

    .Calc__slider label {
        font-size: var(--font-size-base)
    }

    .Calc__range .Calc__value-label {
        font-size: var(--font-size-base);
        padding: 5px
    }

    .Calc__calculation {
        font-size: var(--font-size-h4)
    }

    .Calc__calculation--highlight {
        font-size: var(--font-size-h3)
    }

    .Calc__get-results-form .h3,
    .Calc__results-cta h4 {
        font-size: var(--font-size-base) !important
    }

    .CaseStudyTabItem .StatsItem__description {
        max-width: 240px
    }

    .TwoColumnBanner__text-and-button-container {
        flex-wrap: wrap
    }

    .TwoColumnBanner--benefits .TwoColumnBanner--grid .TwoColumnBanner__text {
        order: 1
    }

    .TwoColumnBanner--benefits .TwoColumnBanner--grid .TwoColumnBanner__optional {
        order: 3
    }

    .TwoColumnBanner--benefits .TwoColumnBanner--grid .TwoColumnBanner__form {
        order: 2
    }

    .TwoColumnBanner--benefits .TwoColumnBanner--grid .TwoColumnBanner--left {
        display: contents
    }

    .RecommendationsItem__text {
        font-size: var(--font-size-s);
        line-height: 140%;
        max-width: 300px
    }

    .Timeline__item {
        margin-left: 60px
    }

    .Timeline__item:after {
        border-width: 20px;
        top: 30px
    }

    .Timeline__line {
        left: -53px;
        top: 50px
    }

    .Timeline__line--last {
        max-height: calc(100% - 50px)
    }

    .Timeline__dot,
    .Timeline__line--last:after {
        height: 16px;
        width: 16px
    }

    .Timeline__dot {
        left: -60px;
        top: 50px
    }

    .TabbedCardGrid__buttons {
        gap: calc(var(--m-spacing)/2)
    }

    .StickyFeature__container,
    .TabbedCardGrid__tab-content {
        flex-direction: column
    }

    .StickyFeature__features-column {
        width: 100%
    }

    .StickyFeature__feature:not(:last-child) {
        margin-bottom: var(--m-spacing)
    }

    .StickyFeature__features-media-column {
        display: none
    }

    .ScrollCard__content {
        flex-direction: column
    }

    .CardsGrid__header--sticky {
        margin: 0;
        padding: 0;
        position: relative;
        top: 0
    }

    .CardsGrid__image--mobile {
        display: block
    }

    .CardsGrid__image--desktop {
        display: none
    }

    .ButtonList h2 {
        text-align: center
    }

    .ButtonList__list {
        align-items: center;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center
    }

    .ButtonList__card {
        display: none
    }

    .ImageHotspotArea__container {
        align-items: flex-start
    }

    .ImageHotspotArea__editor-message {
        display: flex
    }

    .ImageHotspotArea__heading {
        text-align: left
    }

    .ImageHotspotArea__gate-form-wrapper {
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px)
    }

    .ImageHotspotArea__gate-form {
        width: 96%
    }

    .ImageHotspotArea__gate-form .h3 {
        font-size: var(--font-size-h6) !important
    }

    .ImageHotspotArea__buttons,
    .ImageHotspotArea__images {
        display: none
    }

    .ComparisonTable__card-title-logo {
        width: 60%
    }
}

@media (max-width:679px) {
    body::-webkit-scrollbar {
        display: none
    }
}

@media (max-width:600px) {
    .ComparisonTable__card-title-logo {
        width: 70%
    }
}

@media (max-width:500px) {
    .slider-slide {
        min-width: 95%
    }

    .LogoRow__logo-wrapper--large img {
        height: 80px !important
    }
}

@media (hover:hover) and (pointer:fine) {
    a:hover {
        opacity: .8
    }

    .Button--no-text.Button--circle:hover svg {
        transform: none
    }

    .Button--full.Button--xl a:hover svg,
    .Button--full.Button--xl button:hover svg {
        transform: translateX(9px)
    }

    .Button--full.Button--l a:hover svg,
    .Button--full.Button--l button:hover svg {
        transform: translateX(5px)
    }

    .Button--full a:hover,
    .Button--full button:hover {
        border-color: var(--colour-purple-dark);
        color: var(--colour-white)
    }

    .Button--full a:hover svg,
    .Button--full button:hover svg {
        transform: translateX(6px)
    }

    .Button--full a:hover svg path,
    .Button--full button:hover svg path {
        stroke: var(--colour-white)
    }

    .Button--full a:hover:after,
    .Button--full button:hover:after {
        opacity: 1;
        width: calc(100% + 4px)
    }

    .Button--circle a:hover svg,
    .Button--circle button:hover svg {
        transform: rotate(-45deg)
    }

    .Button--circle a:hover svg path,
    .Button--circle button:hover svg path {
        stroke: var(--colour-white)
    }

    .Button--circle a:hover:before,
    .Button--circle button:hover:before {
        background: var(--colour-purple-dark)
    }

    .Button--plain-white a:hover svg,
    .Button--plain-white button:hover svg {
        transform: translateX(6px)
    }

    .Button--lavender a:hover,
    .Button--lavender button:hover {
        background: var(--colour-green)
    }

    .Button--lavender-light a:hover,
    .Button--lavender-light button:hover {
        background: var(--colour-lavender-light);
        border-color: var(--colour-lavender);
        color: var(--colour-heading)
    }

    .Button--lavender-light a:hover svg path,
    .Button--lavender-light button:hover svg path {
        stroke: var(--colour-heading)
    }

    .Button--orange a:hover,
    .Button--orange button:hover {
        background: var(--colour-lavender)
    }

    .Button--orange-light a:hover,
    .Button--orange-light button:hover {
        background: var(--colour-orange-light);
        border-color: var(--colour-orange);
        color: var(--colour-heading)
    }

    .Button--orange-light a:hover svg path,
    .Button--orange-light button:hover svg path {
        stroke: var(--colour-heading)
    }

    .Button--green a:hover,
    .Button--green button:hover {
        background: var(--colour-lavender)
    }

    .Button--green-light a:hover,
    .Button--green-light button:hover {
        background: var(--colour-green-light);
        border-color: var(--colour-green);
        color: var(--colour-heading)
    }

    .Button--green-light a:hover svg path,
    .Button--green-light button:hover svg path {
        stroke: var(--colour-heading)
    }

    .Button--dark a:hover,
    .Button--dark button:hover {
        background: var(--colour-lavender)
    }

    .Button--dark a:hover:before,
    .Button--dark button:hover:before {
        background: var(--colour-orange)
    }

    .Button--white a:hover:before,
    .Button--white button:hover:before {
        background: var(--colour-lavender)
    }

    .CTAStrip .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:hover,
    .CTAStrip .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:hover,
    .CardComponent--cta-card .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:hover,
    .CardComponent--cta-card .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:hover,
    .CardComponent--dark-contained .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:hover,
    .CardComponent--dark-contained .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:hover,
    .ComparisonTable__heading-button-wrapper--recommended .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:hover,
    .ComparisonTable__heading-button-wrapper--recommended .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:hover,
    .SidebarBP:not(.SidebarBP--release-notes) .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:hover,
    .SidebarBP:not(.SidebarBP--release-notes) .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:hover,
    .SidebarCta .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:hover,
    .SidebarCta .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:hover,
    .bg-colour-dark .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:hover,
    .bg-colour-dark .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:hover,
    .bg-colour-purple-2 .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:hover,
    .bg-colour-purple-2 .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:hover {
        border-color: var(--colour-white);
        color: var(--colour-purple-dark)
    }

    .CTAStrip .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:hover svg path,
    .CTAStrip .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:hover svg path,
    .CardComponent--cta-card .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:hover svg path,
    .CardComponent--cta-card .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:hover svg path,
    .CardComponent--dark-contained .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:hover svg path,
    .CardComponent--dark-contained .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:hover svg path,
    .ComparisonTable__heading-button-wrapper--recommended .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:hover svg path,
    .ComparisonTable__heading-button-wrapper--recommended .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:hover svg path,
    .SidebarBP:not(.SidebarBP--release-notes) .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:hover svg path,
    .SidebarBP:not(.SidebarBP--release-notes) .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:hover svg path,
    .SidebarCta .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:hover svg path,
    .SidebarCta .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:hover svg path,
    .bg-colour-dark .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:hover svg path,
    .bg-colour-dark .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:hover svg path,
    .bg-colour-purple-2 .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) a:hover svg path,
    .bg-colour-purple-2 .Button--full:not(.Button--lavender-light):not(.Button--orange-light):not(.Button--green-light) button:hover svg path {
        stroke: var(--colour-purple-dark)
    }

    .CTAStrip .Button--lavender a:hover:before,
    .CTAStrip .Button--lavender button:hover:before,
    .CTAStrip .Button--orange a:hover:before,
    .CTAStrip .Button--orange button:hover:before,
    .CardComponent--cta-card .Button--lavender a:hover:before,
    .CardComponent--cta-card .Button--lavender button:hover:before,
    .CardComponent--cta-card .Button--orange a:hover:before,
    .CardComponent--cta-card .Button--orange button:hover:before,
    .CardComponent--dark-contained .Button--lavender a:hover:before,
    .CardComponent--dark-contained .Button--lavender button:hover:before,
    .CardComponent--dark-contained .Button--orange a:hover:before,
    .CardComponent--dark-contained .Button--orange button:hover:before,
    .ComparisonTable__heading-button-wrapper--recommended .Button--lavender a:hover:before,
    .ComparisonTable__heading-button-wrapper--recommended .Button--lavender button:hover:before,
    .ComparisonTable__heading-button-wrapper--recommended .Button--orange a:hover:before,
    .ComparisonTable__heading-button-wrapper--recommended .Button--orange button:hover:before,
    .SidebarBP:not(.SidebarBP--release-notes) .Button--lavender a:hover:before,
    .SidebarBP:not(.SidebarBP--release-notes) .Button--lavender button:hover:before,
    .SidebarBP:not(.SidebarBP--release-notes) .Button--orange a:hover:before,
    .SidebarBP:not(.SidebarBP--release-notes) .Button--orange button:hover:before,
    .SidebarCta .Button--lavender a:hover:before,
    .SidebarCta .Button--lavender button:hover:before,
    .SidebarCta .Button--orange a:hover:before,
    .SidebarCta .Button--orange button:hover:before,
    .bg-colour-dark .Button--lavender a:hover:before,
    .bg-colour-dark .Button--lavender button:hover:before,
    .bg-colour-dark .Button--orange a:hover:before,
    .bg-colour-dark .Button--orange button:hover:before,
    .bg-colour-purple-2 .Button--lavender a:hover:before,
    .bg-colour-purple-2 .Button--lavender button:hover:before,
    .bg-colour-purple-2 .Button--orange a:hover:before,
    .bg-colour-purple-2 .Button--orange button:hover:before {
        background: var(--colour-green)
    }

    .CTAStrip .Button--green a:hover:before,
    .CTAStrip .Button--green button:hover:before,
    .CTAStrip .Button--white a:hover,
    .CTAStrip .Button--white button:hover,
    .CardComponent--cta-card .Button--green a:hover:before,
    .CardComponent--cta-card .Button--green button:hover:before,
    .CardComponent--cta-card .Button--white a:hover,
    .CardComponent--cta-card .Button--white button:hover,
    .CardComponent--dark-contained .Button--green a:hover:before,
    .CardComponent--dark-contained .Button--green button:hover:before,
    .CardComponent--dark-contained .Button--white a:hover,
    .CardComponent--dark-contained .Button--white button:hover,
    .ComparisonTable__heading-button-wrapper--recommended .Button--green a:hover:before,
    .ComparisonTable__heading-button-wrapper--recommended .Button--green button:hover:before,
    .ComparisonTable__heading-button-wrapper--recommended .Button--white a:hover,
    .ComparisonTable__heading-button-wrapper--recommended .Button--white button:hover,
    .SidebarBP:not(.SidebarBP--release-notes) .Button--green a:hover:before,
    .SidebarBP:not(.SidebarBP--release-notes) .Button--green button:hover:before,
    .SidebarBP:not(.SidebarBP--release-notes) .Button--white a:hover,
    .SidebarBP:not(.SidebarBP--release-notes) .Button--white button:hover,
    .SidebarCta .Button--green a:hover:before,
    .SidebarCta .Button--green button:hover:before,
    .SidebarCta .Button--white a:hover,
    .SidebarCta .Button--white button:hover,
    .bg-colour-dark .Button--green a:hover:before,
    .bg-colour-dark .Button--green button:hover:before,
    .bg-colour-dark .Button--white a:hover,
    .bg-colour-dark .Button--white button:hover,
    .bg-colour-purple-2 .Button--green a:hover:before,
    .bg-colour-purple-2 .Button--green button:hover:before,
    .bg-colour-purple-2 .Button--white a:hover,
    .bg-colour-purple-2 .Button--white button:hover {
        background: var(--colour-orange)
    }

    .CardComponent--linked {
        cursor: pointer
    }

    .CardComponent--linked.CardComponent:hover .CardComponent__image img {
        transform: scale(1.05)
    }

    .CardComponent--linked.CardComponent:hover .CardComponent__icon,
    .CardComponent--linked.CardComponent:hover .CardComponent__icon-2 {
        transform: scale(1.08)
    }

    .CardComponent--linked.CardComponent:hover .CardComponent__bottom-button-wrapper .Button--full a {
        border-color: var(--colour-purple-dark);
        color: var(--colour-white)
    }

    .CardComponent--linked.CardComponent:hover .CardComponent__bottom-button-wrapper .Button--full a svg {
        transform: translateX(6px)
    }

    .CardComponent--linked.CardComponent:hover .CardComponent__bottom-button-wrapper .Button--full a svg path {
        stroke: var(--colour-white)
    }

    .CardComponent--linked.CardComponent:hover .CardComponent__bottom-button-wrapper .Button--full a:after {
        opacity: 1;
        width: calc(100% + 4px)
    }

    .CardComponent--linked.CardComponent:hover .CardComponent__bottom-button-wrapper .Button--circle a svg {
        transform: rotate(-45deg)
    }

    .CardComponent--linked.CardComponent:hover .CardComponent__bottom-button-wrapper .Button--circle a svg path {
        stroke: var(--colour-white)
    }

    .CardComponent--linked.CardComponent:hover .CardComponent__bottom-button-wrapper .Button--circle a:before {
        background: var(--colour-purple-dark)
    }

    .CardComponent--linked.CardComponent:hover .CardComponent__bottom-button-wrapper .Button--lavender a {
        background: var(--colour-green)
    }

    .CardComponent--linked.CardComponent:hover .CardComponent__bottom-button-wrapper .Button--green a,
    .CardComponent--linked.CardComponent:hover .CardComponent__bottom-button-wrapper .Button--orange a {
        background: var(--colour-lavender)
    }

    .CardComponent--linked.CardComponent--cta-card:hover .CardComponent__bottom-button-wrapper .Button--full a,
    .CardComponent--linked.CardComponent--dark-contained:hover .CardComponent__bottom-button-wrapper .Button--full a {
        border-color: var(--colour-white);
        color: var(--colour-purple-dark)
    }

    .CardComponent--linked.CardComponent--cta-card:hover .CardComponent__bottom-button-wrapper .Button--full a svg path,
    .CardComponent--linked.CardComponent--dark-contained:hover .CardComponent__bottom-button-wrapper .Button--full a svg path {
        stroke: var(--colour-purple-dark)
    }

    .CardComponent--linked.CardComponent--cta-card:hover .CardComponent__bottom-button-wrapper .Button--lavender a:before,
    .CardComponent--linked.CardComponent--cta-card:hover .CardComponent__bottom-button-wrapper .Button--orange a:before,
    .CardComponent--linked.CardComponent--dark-contained:hover .CardComponent__bottom-button-wrapper .Button--lavender a:before,
    .CardComponent--linked.CardComponent--dark-contained:hover .CardComponent__bottom-button-wrapper .Button--orange a:before {
        background: var(--colour-green)
    }

    .CardComponent--linked.CardComponent--cta-card:hover .CardComponent__bottom-button-wrapper .Button--green a:before,
    .CardComponent--linked.CardComponent--dark-contained:hover .CardComponent__bottom-button-wrapper .Button--green a:before {
        background: var(--colour-orange)
    }

    .TabsComponent__tab-wrapper:hover .TabsComponent__tab {
        background: var(--element-accent-colour-light)
    }

    .Accordion__items .Accordion__tab:hover .Accordion__question {
        color: var(--module-accent-colour)
    }

    .Calc .cta-button:hover,
    .Calc .go-back-button:hover {
        border-color: var(--colour-purple-dark);
        color: var(--colour-white)
    }

    .Calc .cta-button:hover svg,
    .Calc .go-back-button:hover svg {
        transform: translateX(6px)
    }

    .Calc .cta-button:hover svg path,
    .Calc .go-back-button:hover svg path {
        stroke: var(--colour-white)
    }

    .Calc .cta-button:hover:after,
    .Calc .go-back-button:hover:after {
        opacity: 1;
        width: calc(100% + 4px)
    }

    .Calc .cta-button--lavender:hover,
    .Calc .go-back-button--lavender:hover {
        background: var(--colour-green)
    }

    .Calc .cta-button--green:hover,
    .Calc .cta-button--orange:hover,
    .Calc .go-back-button--green:hover,
    .Calc .go-back-button--orange:hover {
        background: var(--colour-lavender)
    }

    .Calc .cta-button--white-go-back:hover svg,
    .Calc .go-back-button--white-go-back:hover svg {
        transform: translateX(-6px) rotate(180deg)
    }

    .Calc .cta-button--white-go-back:hover:before,
    .Calc .go-back-button--white-go-back:hover:before {
        background: var(--colour-lavender)
    }

    .HubHeader__quick-link:hover {
        border-color: var(--colour-lavender);
        opacity: 1
    }

    .HubHeader__quick-link:hover:after {
        opacity: 1;
        width: calc(100% + 4px)
    }

    .HubHeader__quick-link--active:hover {
        background: var(--colour-purple-dark);
        border-color: var(--colour-purple-dark);
        color: var(--colour-white)
    }

    .HubHeader__quick-link--active:hover:after {
        display: none
    }

    .BlogPost__content .elementor-button:hover,
    .BlogPost__content a[role=button]:hover {
        background: var(--colour-lavender);
        border-color: var(--colour-purple-dark);
        color: var(--colour-white)
    }

    .BlogPost__content .elementor-button:hover:after,
    .BlogPost__content a[role=button]:hover:after {
        opacity: 1;
        width: calc(100% + 4px)
    }
}

@media (prefers-reduced-motion:reduce) {
    * {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important
    }
}