:root {
    --brand-color: #4267B2;
    --brand-color-dark: #2d4a8a;
    --brand-color-light: #6b8fd4;
    --brand-text: #ffffff;
}
.btn-brand { background-color: var(--brand-color); color: var(--brand-text); border: none; }
.btn-brand:hover { background-color: var(--brand-color-dark); color: var(--brand-text); }
.bg-brand { background-color: var(--brand-color); }
.text-brand { color: var(--brand-color); }
.border-brand { border-color: var(--brand-color); }
a { color: var(--brand-color); }
a:hover { color: var(--brand-color-dark); }

/* Override Ark's hardcoded cyan (#00bcd4) with brand colour */
.lists-base .lists-item-element-bg,
.lists-dark .lists-item-element-bg,
.lists-base > li .lists-item-element-bg,
.lists-dark > li .lists-item-element-bg {
    background: var(--brand-color) !important;
}

.header .navbar-nav .nav-item-child:hover,
.header .navbar-nav .nav-item-child:focus,
.header .navbar-nav .nav-item-child.active,
.header .navbar-nav .nav-item-child.active:hover,
.header .navbar-nav .nav-item:hover .nav-item-child {
    color: var(--brand-color) !important;
}

/* Dropdown top border */
.header .navbar-nav .nav-item .dropdown-menu {
    border-top: 2px solid var(--brand-color) !important;
}

.header .dropdown-menu .dropdown-menu-item .dropdown-menu-item-child:hover,
.header .dropdown-menu .dropdown-menu-item .dropdown-menu-item-child:focus {
    background: var(--brand-color) !important;
    color: #fff !important;
}

.header .dropdown-menu .dropdown-menu-item .dropdown-menu-item-child.active:hover,
.header .dropdown-menu .dropdown-menu-item.active .dropdown-menu-item-child {
    color: var(--brand-color) !important;
}

/* Section heading subtitle */
.heading-v1 .heading-v1-subtitle {
    color: var(--brand-color) !important;
}

/* Speaker card social link hover */
.team-v1 .team-v1-content .team-v1-socials .team-v1-socials-link:hover {
    color: var(--brand-color) !important;
}

/* Ark slide button using brand colour instead of hardcoded cyan */
.btn-brand-slide { background: var(--brand-color) !important; color: var(--brand-text) !important; }
.btn-brand-slide:hover,
.btn-brand-slide:focus,
.btn-brand-slide.focus { background: var(--brand-color) !important; color: var(--brand-text) !important; }
.btn-brand-slide:after,
.btn-brand-slide:before { background: var(--brand-color-dark) !important; }