/*======================================================================
    Variables
======================================================================*/
:root {
    /* Color Scheme */
    color-scheme: only light;

    /* Primary Colors */
    --primary-000: #353F49;
    --primary-050: #F4F5F7;
    --primary-100: #E1E4E9;
    --primary-200: #BAC3CD;
    --primary-300: #94A2B1;
    --primary-400: #6D8195;
    --primary-500: #51606F;
    --primary-600: #353F49;
    --primary-700: #2A323A;
    --primary-800: #20262B;
    --primary-900: #15191D;
    --primary-950: #0F1315;

    /* Accent Colors */
    --accent-base: #221631;
    --accent-050: #D2C3E4;
    --accent-100: #C7B5DE;
    --accent-200: #B299D1;
    --accent-300: #9C7DC5;
    --accent-400: #8761B8;
    --accent-500: #724AA5;
    --accent-600: #58397F;
    --accent-700: #3D2858;
    --accent-800: #221631;
    --accent-900: #07050B;

    /* Layout Variables */
    --navbar-height: 64px;
    --side-navbar-width: 3.5rem;
    --main-container-left: var(--side-navbar-width);
    --main-container-margin-top: 12px;
    --hero-height: 70vh;
    --card-min-height: auto;
    --text-font-size: 1rem;
    --text-min-height: 50px;
    --partner-logo-max-height: 50px;
}

/*======================================================================
    Base Styles
======================================================================*/
html,
body {
    scroll-behavior: smooth;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    font-family: 'Poppins', sans-serif;
    font-size: 1rem;
    line-height: 1.5;
    background: #F8F9FA;
    padding-top: var(--navbar-height);
}

/*======================================================================
    Typography Styles
======================================================================*/
.title,
.title-side {
    --spacing: 0.5rem;
    letter-spacing: var(--spacing);
    font-weight: 600;
    font-family: 'Montserrat', sans-serif;
}

.subtitle {
    --spacing: 0.075rem;
    font-weight: 400;
    letter-spacing: var(--spacing);
    font-family: 'Montserrat', sans-serif;
}

.title-side {
    text-align: right;
    margin-right: calc(var(--spacing) * -1) !important;
    font-size: 1.5rem;
}

.text-font-size {
    font-size: var(--text-font-size) !important;
}

.text-min-height {
    min-height: var(--text-min-height);
}

.text-glow {
    text-shadow: 0 0 10px rgba(210, 195, 228, 0.5);
}

/*======================================================================
    Utility Classes
======================================================================*/
.bg-glass {
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    will-change: backdrop-filter;
}

.grayscale {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    opacity: 0.6;
    transition: all 0.3s ease-in-out;
}

.grayscale:hover {
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
    opacity: 1;
    transition: all 0.3s ease-in-out;
}

.nx-vh-25 {
    height: calc(35vh - (var(--navbar-height) / 2));
    min-height: calc(35vh - (var(--navbar-height) / 2));
}
.nx-vh-50 {
    height: calc(50vh - (var(--navbar-height) / 2));
    min-height: calc(50vh - (var(--navbar-height) / 2));
}

.nx-img-overlay {
    position: relative;
    overflow: hidden;
}

.nx-img-overlay:before {
    content: "";
    width: 100%;
    height: 100%;
    z-index: 1;
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(45deg, var(--primary-100), var(--primary-400));
    opacity: 1;
    mix-blend-mode: hard-light;
}

.spotlight:before {
    content: "";
    width: 100%;
    height: 100%;
    z-index: 1;
    position: absolute;
    top: 0;
    left: 0;
    background: radial-gradient(50vw 60vw at 50% 70%, rgba(210, 195, 228, 0.08) 0%, rgba(210, 195, 228, 0) 60%),
        radial-gradient(35% 15% at 50% 85%, rgba(210, 195, 228, 0.09) 0%, rgba(210, 195, 228, 0) 100%);
}

/*======================================================================
    Component Styles
======================================================================*/
/* Navbar */
.navbar-fixed {
    min-height: var(--navbar-height);
    z-index: 2;
    left: var(--side-navbar-width);
    width: calc(100% - var(--side-navbar-width)) !important;
}

.side-navbar-fixed {
    z-index: 3;
}

/* Main Container */
.main-container {
    position: relative;
    left: calc(var(--main-container-left) / 2);
    width: calc(100% - var(--main-container-left));
    margin-top: var(--main-container-margin-top);
}

/* Hero Section */
.hero-section {
    height: var(--hero-height);
}

section[id] {
    scroll-margin-top: var(--navbar-height)
}

/* Card */
.card-min-height {
    min-height: var(--card-min-height);
}

.card-hover-up {
    transition: transform 0.3s ease-in-out;
}

.card-hover-up:hover {
    transform: translateY(-10px);
}

/* Partner Logo */
.partner-logo {
    max-height: var(--partner-logo-max-height);
}

/*======================================================================
    Bootstrap Overrides
======================================================================*/
/* Buttons */
.btn {
    --bs-btn-border-radius: 0;
}

/* Cards */
.card {
    --bs-card-border-radius: 0;
    --bs-card-border-width: 0;
}

/* Navigation Links */
.nav-link {
    color: var(--primary-700);
    transition: color .3s ease-in-out;
}

.nav-link:hover,
.nav-link.active,
.nav-link:focus,
.nav-link:active,
.nav-link:focus-within {
    color: var(--primary-500);
    transition: color .3s ease-in-out;
}

/*======================================================================
    Color Classes (Primary and Accent Colors)
======================================================================*/
/* Background Colors - Primary */
.nx-bg-000 {
    background-color: var(--primary-000);
}

.nx-bg-050 {
    background-color: var(--primary-050);
}

.nx-bg-100,
.nx-bg-lightest {
    background-color: var(--primary-100);
}

.nx-bg-200,
.nx-bg-lighter {
    background-color: var(--primary-200);
}

.nx-bg-300,
.nx-bg-light {
    background-color: var(--primary-300);
}

.nx-bg-400 {
    background-color: var(--primary-400);
}

.nx-bg-500,
.nx-bg-primary {
    background-color: var(--primary-500);
}

.nx-bg-600 {
    background-color: var(--primary-600);
}

.nx-bg-700,
.nx-bg-dark {
    background-color: var(--primary-700);
}

.nx-bg-800,
.nx-bg-darker {
    background-color: var(--primary-800);
}

.nx-bg-900,
.nx-bg-darkest {
    background-color: var(--primary-900);
}

.nx-bg-950 {
    background-color: var(--primary-950);
}

/* Text Colors - Primary */
.nx-text-000 {
    color: var(--primary-000);
}

.nx-text-050 {
    color: var(--primary-050);
}

.nx-text-100 {
    color: var(--primary-100);
}

.nx-text-200 {
    color: var(--primary-200);
}

.nx-text-300 {
    color: var(--primary-300);
}

.nx-text-400 {
    color: var(--primary-400);
}

.nx-text-500,
.nx-text-primary {
    color: var(--primary-500);
}

.nx-text-600 {
    color: var(--primary-600);
}

.nx-text-700,
.nx-text-dark {
    color: var(--primary-700);
}

.nx-text-800 {
    color: var(--primary-800);
}

.nx-text-900 {
    color: var(--primary-900);
}

.nx-text-950 {
    color: var(--primary-950);
}

/* Border Colors - Primary */
.nx-border-000 {
    border-color: var(--primary-000) !important;
}

.nx-border-050 {
    border-color: var(--primary-050) !important;
}

.nx-border-100,
.nx-border-light {
    border-color: var(--primary-100) !important;
}

.nx-border-200 {
    border-color: var(--primary-200) !important;
}

.nx-border-300 {
    border-color: var(--primary-300) !important;
}

.nx-border-400 {
    border-color: var(--primary-400) !important;
}

.nx-border-500,
.nx-border-primary {
    border-color: var(--primary-500) !important;
}

.nx-border-600 {
    border-color: var(--primary-600) !important;
}

.nx-border-700,
.nx-border-dark {
    border-color: var(--primary-700) !important;
}

.nx-border-800 {
    border-color: var(--primary-800) !important;
}

.nx-border-900 {
    border-color: var(--primary-900) !important;
}

.nx-border-950 {
    border-color: var(--primary-950) !important;
}

/* Background Colors - Accent */
.nx-bg-accent-base {
    background-color: var(--accent-base);
}

.nx-bg-accent-050 {
    background-color: var(--accent-050);
}

.nx-bg-accent-100 {
    background-color: var(--accent-100);
}

.nx-bg-accent-200 {
    background-color: var(--accent-200);
}

.nx-bg-accent-300 {
    background-color: var(--accent-300);
}

.nx-bg-accent-400 {
    background-color: var(--accent-400);
}

.nx-bg-accent-500 {
    background-color: var(--accent-500);
}

.nx-bg-accent-600 {
    background-color: var(--accent-600);
}

.nx-bg-accent-700 {
    background-color: var(--accent-700);
}

.nx-bg-accent-800 {
    background-color: var(--accent-800);
}

.nx-bg-accent-900 {
    background-color: var(--accent-900);
}

/* Text Colors - Accent */
.nx-text-accent-base {
    color: var(--accent-base);
}

.nx-text-accent-050 {
    color: var(--accent-050);
}

.nx-text-accent-100 {
    color: var(--accent-100);
}

.nx-text-accent-200 {
    color: var(--accent-200);
}

.nx-text-accent-300 {
    color: var(--accent-300);
}

.nx-text-accent-400 {
    color: var(--accent-400);
}

.nx-text-accent-500 {
    color: var(--accent-500);
}

.nx-text-accent-600 {
    color: var(--accent-600);
}

.nx-text-accent-700 {
    color: var(--accent-700);
}

.nx-text-accent-800 {
    color: var(--accent-800);
}

.nx-text-accent-900 {
    color: var(--accent-900);
}

/* Border Colors - Accent */
.nx-border-accent-base {
    border-color: var(--accent-base) !important;
}

.nx-border-accent-050 {
    border-color: var(--accent-050) !important;
}

.nx-border-accent-100 {
    border-color: var(--accent-100) !important;
}

.nx-border-accent-200 {
    border-color: var(--accent-200) !important;
}

.nx-border-accent-300 {
    border-color: var(--accent-300) !important;
}

.nx-border-accent-400 {
    border-color: var(--accent-400) !important;
}

.nx-border-accent-500 {
    border-color: var(--accent-500) !important;
}

.nx-border-accent-600 {
    border-color: var(--accent-600) !important;
}

.nx-border-accent-700 {
    border-color: var(--accent-700) !important;
}

.nx-border-accent-800 {
    border-color: var(--accent-800) !important;
}

.nx-border-accent-900 {
    border-color: var(--accent-900) !important;
}

/*======================================================================
    Gradient Backgrounds and Text
======================================================================*/
.nx-bg-gradient-light {
    background: linear-gradient(315deg, var(--primary-300), var(--primary-100));
}

.nx-bg-gradient-dark {
    background: linear-gradient(315deg, var(--primary-700), var(--primary-500));
}

.nx-bg-gradient-darker {
    background: linear-gradient(315deg, var(--primary-800), var(--primary-700));
}

.nx-bg-gradient-darkest {
    background: linear-gradient(315deg, var(--primary-900), var(--primary-800));
}

.nx-text-gradient-light {
    background: linear-gradient(315deg, var(--primary-300), var(--primary-050));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.nx-text-gradient-lighter {
    background: linear-gradient(315deg, var(--primary-200), var(--primary-100));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.nx-text-gradient-lightest {
    background: linear-gradient(315deg, var(--primary-050), var(--primary-100));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.nx-text-gradient-dark {
    background: linear-gradient(315deg, var(--primary-700), var(--primary-500));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Accent Gradients */
.nx-bg-gradient-accent-light {
    background: linear-gradient(315deg, var(--accent-300), var(--accent-100));
}

.nx-bg-gradient-accent-dark {
    background: linear-gradient(315deg, var(--accent-700), var(--accent-500));
}

.nx-text-gradient-accent-light {
    background: linear-gradient(315deg, var(--accent-300), var(--accent-050));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.nx-text-gradient-accent-dark {
    background: linear-gradient(315deg, var(--accent-700), var(--accent-500));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}


/*======================================================================
    Link Styles
======================================================================*/
.nx-link {
    text-decoration: none;
    transition: color 0.3s ease-in-out;
}

.nx-link:hover,
.nx-link:focus,
.nx-link:active {
    text-decoration: underline;
}

/*======================================================================
    Primary Link Variants
======================================================================*/

/* Lightest variant */
.nx-link-lightest {
    color: var(--primary-050);
}

.nx-link-lightest:hover,
.nx-link-lightest:focus,
.nx-link-lightest:active {
    color: var(--primary-200);
}

/* Lighter variant */
.nx-link-lighter {
    color: var(--primary-100);
}

.nx-link-lighter:hover,
.nx-link-lighter:focus,
.nx-link-lighter:active {
    color: var(--primary-300);
}

/* Light variant */
.nx-link-light {
    color: var(--primary-200);
}

.nx-link-light:hover,
.nx-link-light:focus,
.nx-link-light:active {
    color: var(--primary-400);
}

/* Dark variant */
.nx-link-dark {
    color: var(--primary-700);
}

.nx-link-dark:hover,
.nx-link-dark:focus,
.nx-link-dark:active {
    color: var(--primary-500);
}

/* Darker variant */
.nx-link-darker {
    color: var(--primary-800);
}

.nx-link-darker:hover,
.nx-link-darker:focus,
.nx-link-darker:active {
    color: var(--primary-600);
}

/* Darkest variant */
.nx-link-darkest {
    color: var(--primary-900);
}

.nx-link-darkest:hover,
.nx-link-darkest:focus,
.nx-link-darkest:active {
    color: var(--primary-700);
}

/*======================================================================
    Accent Link Variants
======================================================================*/

/* Lightest variant */
.nx-link-accent-lightest {
    color: var(--accent-050);
}

.nx-link-accent-lightest:hover,
.nx-link-accent-lightest:focus,
.nx-link-accent-lightest:active {
    color: var(--accent-200);
}

/* Lighter variant */
.nx-link-accent-lighter {
    color: var(--accent-100);
}

.nx-link-accent-lighter:hover,
.nx-link-accent-lighter:focus,
.nx-link-accent-lighter:active {
    color: var(--accent-300);
}

/* Light variant */
.nx-link-accent-light {
    color: var(--accent-300);
}

.nx-link-accent-light:hover,
.nx-link-accent-light:focus,
.nx-link-accent-light:active {
    color: var(--accent-500);
}

/* Dark variant */
.nx-link-accent-dark {
    color: var(--accent-700);
}

.nx-link-accent-dark:hover,
.nx-link-accent-dark:focus,
.nx-link-accent-dark:active {
    color: var(--accent-500);
}

/* Darker variant */
.nx-link-accent-darker {
    color: var(--accent-800);
}

.nx-link-accent-darker:hover,
.nx-link-accent-darker:focus,
.nx-link-accent-darker:active {
    color: var(--accent-600);
}

/* Darkest variant */
.nx-link-accent-darkest {
    color: var(--accent-900);
}

.nx-link-accent-darkest:hover,
.nx-link-accent-darkest:focus,
.nx-link-accent-darkest:active {
    color: var(--accent-700);
}

.nx-link-accent-primary {
    color: var(--accent-500);
}

.nx-link-accent-primary:hover,
.nx-link-accent-primary:focus,
.nx-link-accent-primary:active {
    color: var(--accent-700);
}


/*======================================================================
    Buttons (nx-button)
======================================================================*/
.nx-button {
    display: inline-block;
    font-weight: 500;
    color: var(--primary-050);
    background-color: var(--primary-500);
    border: 1px solid var(--primary-500);
    padding: 0.375rem 0.75rem;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}

.nx-button:hover,
.nx-button:focus,
.nx-button:active {
    background-color: var(--primary-700);
    border-color: var(--primary-700);
    color: var(--primary-050);
}

/* Added missing accent buttons */
.nx-btn-primary {
    background-color: var(--primary-500);
    border-color: var(--primary-500);
    color: var(--primary-050);
}

.nx-btn-primary:hover,
.nx-btn-primary:focus,
.nx-btn-primary:active {
    background-color: var(--primary-700);
    border-color: var(--primary-700);
    color: var(--primary-050);
}

.nx-btn-accent {
    background-color: var(--accent-500);
    border-color: var(--accent-500);
    color: var(--primary-050);
}

.nx-btn-accent:hover,
.nx-btn-accent:focus,
.nx-btn-accent:active {
    background-color: var(--accent-700);
    border-color: var(--accent-700);
    color: var(--primary-050);
}

.nx-btn-gradient-light {
    background: linear-gradient(315deg, var(--primary-300), var(--primary-100));
    color: var(--primary-050);
    border: 1px solid var(--primary-300);
}

.nx-btn-gradient-light:hover,
.nx-btn-gradient-light:focus,
.nx-btn-gradient-light:active {
    background: linear-gradient(315deg, var(--primary-500), var(--primary-300));
    border-color: var(--primary-500);
    color: var(--primary-050);
}

.nx-btn-gradient-lighter {
    background: linear-gradient(315deg, var(--primary-200), var(--primary-100));
    color: var(--primary-050);
    border: 1px solid var(--primary-200);
}

.nx-btn-gradient-lighter:hover,
.nx-btn-gradient-lighter:focus,
.nx-btn-gradient-lighter:active {
    background: linear-gradient(315deg, var(--primary-400), var(--primary-200));
    border-color: var(--primary-400);
    color: var(--primary-050);
}

.nx-btn-gradient-lightest {
    background: linear-gradient(315deg, var(--primary-050), var(--primary-100));
    color: var(--primary-050);
    border: 1px solid var(--primary-050);
}

.nx-btn-gradient-lightest:hover,
.nx-btn-gradient-lightest:focus,
.nx-btn-gradient-lightest:active {
    background: linear-gradient(315deg, var(--primary-300), var(--primary-050));
    border-color: var(--primary-300);
    color: var(--primary-050);
}

.nx-btn-gradient-dark {
    background: linear-gradient(315deg, var(--primary-700), var(--primary-500));
    color: var(--primary-050);
    border: 1px solid var(--primary-700);
}

.nx-btn-gradient-dark:hover,
.nx-btn-gradient-dark:focus,
.nx-btn-gradient-dark:active {
    background: linear-gradient(315deg, var(--primary-900), var(--primary-700));
    border-color: var(--primary-900);
    color: var(--primary-050);
}

.nx-btn-gradient-darker {
    background: linear-gradient(315deg, var(--primary-800), var(--primary-700));
    color: var(--primary-050);
    border: 1px solid var(--primary-800);
}

.nx-btn-gradient-darker:hover,
.nx-btn-gradient-darker:focus,
.nx-btn-gradient-darker:active {
    background: linear-gradient(315deg, var(--primary-900), var(--primary-800));
    border-color: var(--primary-900);
    color: var(--primary-050);
}

.nx-btn-gradient-darkest {
    background: linear-gradient(315deg, var(--primary-900), var(--primary-800));
    color: var(--primary-050);
    border: 1px solid var(--primary-900);
}

.nx-btn-gradient-darkest:hover,
.nx-btn-gradient-darkest:focus,
.nx-btn-gradient-darkest:active {
    background: linear-gradient(315deg, var(--primary-950), var(--primary-900));
    border-color: var(--primary-950);
    color: var(--primary-050);
}

.nx-btn-accent-gradient-light {
    background: linear-gradient(315deg, var(--accent-300), var(--accent-100));
    color: var(--primary-050);
    border: 1px solid var(--accent-300);
}

.nx-btn-accent-gradient-light:hover,
.nx-btn-accent-gradient-light:focus,
.nx-btn-accent-gradient-light:active {
    background: linear-gradient(315deg, var(--accent-500), var(--accent-300));
    border-color: var(--accent-500);
    color: var(--primary-050);
}

.nx-btn-accent-gradient-dark {
    background: linear-gradient(315deg, var(--accent-700), var(--accent-500));
    color: var(--primary-050);
    border: 1px solid var(--accent-700);
}

.nx-btn-accent-gradient-dark:hover,
.nx-btn-accent-gradient-dark:focus,
.nx-btn-accent-gradient-dark:active {
    background: linear-gradient(315deg, var(--accent-900), var(--accent-700));
    border-color: var(--accent-900);
    color: var(--primary-050);
}


/*======================================================================
    Alerts (nx-alert)
======================================================================*/
.nx-alert {
    padding: 0.75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: 0.25rem;
    background-color: var(--primary-100);
    color: var(--primary-700);
}

.nx-alert-primary {
    background-color: var(--primary-100);
    color: var(--primary-700);
}

.nx-alert-accent {
    background-color: var(--accent-100);
    color: var(--accent-700);
}

/*======================================================================
    Badges (nx-badge)
======================================================================*/
.nx-badge {
    display: inline-block;
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--primary-050);
    background-color: var(--primary-500);
    border-radius: 0.25rem;
}

.nx-badge-primary {
    background-color: var(--primary-500);
}

.nx-badge-accent {
    background-color: var(--accent-500);
}

/*======================================================================
    Forms (Inputs, Selects, Textareas)
======================================================================*/
.nx-input,
.nx-select,
.nx-textarea {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--primary-700);
    background-color: var(--primary-050);
    border: 1px solid var(--primary-300);
    border-radius: 0.25rem;
    transition: border-color 0.3s ease-in-out, background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}

.nx-input:hover,
.nx-select:hover,
.nx-textarea:hover {
    background-color: var(--primary-100);
    border-color: var(--primary-400);
}

.nx-input:focus,
.nx-select:focus,
.nx-textarea:focus {
    border-color: var(--primary-500);
    outline: none;
    background-color: var(--primary-050);
}

.nx-input:active,
.nx-select:active,
.nx-textarea:active {
    background-color: var(--primary-100);
    border-color: var(--primary-500);
}

.nx-input:disabled,
.nx-select:disabled,
.nx-textarea:disabled {
    background-color: var(--primary-100);
    color: var(--primary-300);
    border-color: var(--primary-200);
}

.nx-input-dark,
.nx-select-dark,
.nx-textarea-dark {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--primary-050) !important;
    background-color: var(--primary-800);
    border: 1px solid var(--primary-600);
    border-radius: 0.25rem;
    transition: border-color 0.3s ease-in-out, background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}

.nx-input-dark:hover,
.nx-select-dark:hover,
.nx-textarea-dark:hover {
    background-color: var(--primary-700);
    border-color: var(--primary-500);
}

.nx-input-dark:focus,
.nx-select-dark:focus,
.nx-textarea-dark:focus {
    border-color: var(--primary-400);
    outline: none;
    background-color: var(--primary-800);
}

.nx-input-dark:active,
.nx-select-dark:active,
.nx-textarea-dark:active {
    background-color: var(--primary-700);
    border-color: var(--primary-400);
}

.nx-input-dark:disabled,
.nx-select-dark:disabled,
.nx-textarea-dark:disabled {
    background-color: var(--primary-900);
    color: var(--primary-600);
    border-color: var(--primary-700);
}
/*======================================================================
    Media Queries
======================================================================*/
/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    :root {
        --side-navbar-width: 4.5rem;
    }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    .mt-xxl-neg-100px {
        margin-top: -250px;
    }

    .h-xxl-100px {
        height: 100px;
    }
}

/* Medium devices (tablets, less than 992px) */
@media (max-width: 992px) {
    :root {
        --animate-duration: 0s;
        --animate-delay: 0s !important;
        --side-navbar-width: 0;
    }

    .main-container {
        --main-container-margin-top: 0;
    }

    #sideNavbar {
        display: none !important;
    }

    #topNavbar {
        left: 0 !important;
        width: 100vw !important;
    }

    .nx-vh-50 {
        height: auto;
        min-height: 50vh;
    }
}

/* 
* Dennis
*/
.home-header__title {
    font-size: 32px;
    letter-spacing: -0.5px;
    line-height: 40px;
    font-weight: 700;
    font-family: "Poppins", "Arial", "Helvetica", "sans-serif";
    display: block;
    margin-bottom: 0;
    color: #C7B5DE
}

@media(min-width: 916px) {
    .home-header__title {
        font-size: 48px;
        letter-spacing: -1px;
        line-height: 60px;
        font-weight: 700
    }
}

.home-header__title--light {
    font-size: 26px;
    letter-spacing: -0.5px;
    line-height: 36px;
    font-weight: 300;
    font-family: "Poppins", "Arial", "Helvetica", "sans-serif";
    display: block;
    margin-bottom: 0;
    color: var(--color-white)
}

@media(min-width: 916px) {
    .home-header__title--light {
        font-size: 33px;
        letter-spacing: -1px;
        line-height: 50px;
        font-weight: 300
    }
}