#hero {
    position: relative;
    min-height: 716px;
    display: flex;
    align-items: flex-end;
    padding: 4.375rem 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    .container-fluid {
        position: relative;
        z-index: 2;
    }
    .title {
        padding-bottom: 2.5rem;
        margin-bottom: 2.5rem;
        border-bottom: solid 1px #C5C8D0;
        h1 {
            color: #FFF;
            font-size: clamp(1.875rem, -1.03rem + 9.2961vw, 6.25rem);
            margin: 0;
        }
    }
    .button {
        display: flex;
        justify-content: flex-end;
        gap: 1.25rem;
        width: auto;
        overflow: auto;
        .btn-primary {
            --bs-btn-color: var(--bs-black);
            --bs-btn-bg: rgba(255,255,255,.6);
            --bs-btn-border-color: rgba(255,255,255,.6);
        }
        .btn {
            white-space: nowrap;
            /* flex: 1 0 auto; */
        }
    }
    &::after {
        content: "";
        display: block;
        position: absolute;
        inset: 0;
        pointer-events: none;
        z-index: 1;
        background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,.9) 80%);
    }
}

#quote {
    padding: 4.5rem 0;
    background-color: #0B0C0F;
    color: var(--bs-white);
    .text {
        font-size: 3.75rem;
        line-height: 1.25;
        strong {
            color: var(--bs-primary);
        }
    }
    .name {
        color: #8F8E9A;
        font-size: 2.5rem;
    }
}

#features {
    padding: 4.5rem 0;
    background-color: var(--bs-white);
    h2 {
        font-weight: 400;
        margin-bottom: 3rem;
    }
    .intro {
        margin-bottom: 4.5rem;
        .text.serif {
            font-size: clamp(1rem, 1.0511rem + 1.2766vw, 1.5rem);
            line-height: 1.25;
        }
    }
    .items {
        display: flex;
        gap: 3.75rem;
        .card {
            --bs-card-spacer-y: 2rem;
            --bs-card-spacer-x: 2rem;
            height: 100%;
            border-radius: var(--bs-border-radius);
            .card-body {
                display: flex;
                flex-direction: column;
            }
            .icon {
                width: 80px;
                height: 80px;
                background-color: rgba(207,252,81,.4);
                border-radius: .75rem;
                display: flex;
                align-items: center;
                justify-content: center;
                padding: 1.25rem;
                margin-bottom: 1.5rem;
            }
            .title {
                margin-bottom: .75rem;
            }
            .text {
                margin-bottom: .5rem;
                font-size: 1.25rem;
            }
            .link {
                margin-top: auto;
                a {
                    --bs-link-color: #0C5EFE;
                    --bs-link-hover-color: #0b4dce;
                    text-decoration: none;
                    font-size: 1.25rem;
                }
            }
            &:hover {
                .icon {
                    background: var(--gradient-bg);
                }
            }
        }
    }
    #callout {
        .item {
            flex-direction: row;
            width: 100%;
        }
        .button {
            margin-bottom: 2.5rem;
            .btn {
                --bs-btn-active-color: #fff;
                --bs-btn-active-bg: var(--bs-black);
                --bs-btn-active-border-color: var(--bs-black);
            }
        }
        .tab-content {
            .tab-pane {
                .row {
                    --bs-gutter-x: 7.5rem;
                }
                .nav {
                    gap: 1.25rem;
                    margin-bottom: 2rem;
                    flex-direction: column;
                    align-items: flex-start;
                    .btn {
                        --bs-btn-color: var(--bs-black);
                        --bs-btn-bg: rgba(var(--bs-primary-rgb),.4);
                        --bs-btn-border-color: rgba(var(--bs-primary-rgb),.4);
                        --bs-btn-active-color: var(--bs-black);
                        --bs-btn-active-bg: rgba(var(--bs-primary-rgb),1);
                        --bs-btn-active-border-color: rgba(var(--bs-primary-rgb),1);
                        padding: .5rem 1.25rem;
                    }
                }
                &:nth-child(even) {
                    .nav {
                        .btn {
                            --bs-btn-bg: rgba(214,227,251,.4);
                            --bs-btn-border-color: rgba(214,227,251,.4);
                            --bs-btn-active-bg: rgba(214,227,251,1);
                            --bs-btn-active-border-color: rgba(214,227,251,1);
                        }
                    }
                }
            }
        }
    }
}

#callout {
    padding: 0 0 3rem 0;
    background-color: var(--bs-white);
    .intro {
        padding-top: 2.5rem;
        margin-bottom: 3.5rem;
        border-top: solid 1px #C5C8D0;
        h2 {
            font-weight: 400;
        }
    }
    .item {
        border-radius: var(--bs-border-radius);
        overflow: hidden;
        background: var(--gradient-bg);
        padding: 1rem;
        display: flex;
        flex-direction: row-reverse;
        gap: 3rem;
        .image {
            border-radius: var(--bs-border-radius);
            overflow: hidden;
            line-height: 0;
            flex: 1 0 48%;
            max-width: 48%;
            img {
                width: 100%;
                height: 100%;
                object-fit: cover;
            }
        }
        .content {
            padding: 1.5rem;
            .link {
                a {
                    --bs-link-color: #0C5EFE;
                    --bs-link-hover-color: #0b4dce;
                    text-decoration: none;
                    font-size: 1.25rem;
                }
            }
            .button {
                display: inline-flex;
                justify-content: space-between;
                margin-top: 3rem;
                border: solid 1px var(--bs-black);
                border-radius: var(--bs-border-radius-2xl);
                padding: .5rem;
                .btn-dark:nth-child(2) {
                    --bs-btn-bg: var(--bs-light);
                    --bs-btn-border-color: var(--bs-light);
                    --bs-btn-hover-bg: var(--bs-light);
                    --bs-btn-hover-border-color: var(--bs-light);
                    --bs-btn-color: var(--bs-black);
                    --bs-btn-hover-color: var(--bs-black);
                }
            }
        }
    }
    .swiper-nav {
        display: flex;
        justify-content: flex-end;
        gap: 1rem;
        margin-bottom: 2.5rem;
        position: relative;
    }
    .swiper-button-next, .swiper-button-prev {
        position: static;
        margin-top: 0;
    }
    .swiper {
        .person {
            text-align: center;
            .image {
                display: block;
                max-width: 100%;
                margin-bottom: 1rem;
                aspect-ratio: 1/1;
                img {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                }
            }
        }
    }
}

#values {
    padding: 4.5rem 0;
    overflow: clip;
    h2 {
        font-weight: 700;
        margin-bottom: 3rem;
    }
    .items {
        overflow: visible;
        padding-bottom: 2.5rem;
        .item {
            flex: 1 0 auto;
            border-radius: var(--bs-border-radius);
            overflow: hidden;
            background: var(--gradient-bg);
            padding: 1.875rem;
        }
        .tag {
            flex: 1 0 100%;
            margin-bottom: .5rem;
        }
        .icon {
            width: 80px;
            height: 80px;
            background-color: rgba(207,252,81,.4);
            border-radius: .75rem;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 1.25rem;
            margin-bottom: 1.5rem;
        }
        .title {
            margin-bottom: .75rem;
        }
        .text {
            margin-bottom: 0;
            font-size: 1.25rem;
            p:last-child {
                margin-bottom: 0;
            }
        }
        &.has-title {
            .item {
                border: solid 1px var(--bs-light-gray);
                background: none;
                height: auto;
            }
        }
        &:not(.has-title) {
            .swiper-wrapper {
                /* gap: 2.25rem; */
            }
            .item {
                display: flex;
                flex-wrap: wrap;
                height: auto;
                .icon {
                    margin-right: 1.875rem;
                    width: 60px;
                    height: auto;
                    background: none;
                    padding: 0;
                    margin-bottom: 0;
                    img {
                        width: 100%;
                    }
                }
            }
        }
        &:not(.swiper-initialized) {
            .swiper-wrapper {
                gap: 2.25rem;
            }
            .item {
                flex: 1 1 auto;
            }
        }
        + .title {
            margin-top: 4.25rem;
            + .items {
                margin-top: 4.25rem;
            }
        }
    }
    + #accordions {
        padding-top: 8rem;
    }
}

#accordions {
    padding: 0 0 8rem 0;
    background-color: var(--bs-white);
    .accordion {
        --bs-accordion-btn-padding-x: 0;
        --bs-accordion-body-padding-x: 0;
        --bs-accordion-color: var(--bs-body-color);
        --bs-accordion-btn-color: var(--bs-body-color);
        --bs-accordion-active-bg: var(--bs-white);
        --bs-accordion-active-color: var(--bs-black);
        --bs-accordion-btn-icon: url("data:image/svg+xml,%3Csvg width='54' height='55' viewBox='0 0 54 55' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='27' cy='27.5' r='26' transform='rotate(-180 27 27.5)' stroke='%235E5D69' stroke-width='2'/%3E%3Cpath d='M21.9999 14.4995L34.9921 27.5078L21.9844 40.4995' stroke='%235E5D69' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
        --bs-accordion-btn-icon-width: 3.375rem;
        --bs-accordion-btn-icon-transform: rotate(90deg);
        --bs-accordion-btn-icon-transition: transform 0.2s ease-in-out;
        --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3Csvg width='54' height='55' viewBox='0 0 54 55' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='54' height='54' transform='translate(54 54.5) rotate(180)' fill='white'/%3E%3Ccircle cx='27' cy='27.5' r='27' transform='rotate(180 27 27.5)' fill='%23121317'/%3E%3Cpath d='M21.9999 14.4995L34.9921 27.5078L21.9844 40.4995' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
        margin-top: 3rem;
        + .title {
            margin-top: 5rem;
        }
        .accordion-button {
            font-size: clamp(1.75rem, 1.3511rem + 1.2766vw, 2.5rem);
            line-height: 1.25;
            &::after {
                background-size: contain;
            }
        }
    }
    .features {
        counter-reset: features;
        display: flex;
        gap: 3.75rem;
        margin-top: 2.25rem;
        .icon {
            width: 80px;
            height: 80px;
            background-color: rgba(207,252,81,.4);
            border-radius: .75rem;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 1.25rem;
            margin-bottom: 1.5rem;
        }
        .title {
            margin-bottom: .75rem;
            h6::before {
                counter-increment: features;
                content: counter(features) ". ";
            }
        }
        .text {
            margin-bottom: .5rem;
            font-size: 1.25rem;
        }
    }
}

#stats {
    padding: 0 0 8rem 0;
    background-color: var(--bs-white);
    .intro {
        margin-bottom: 8rem;
        .button {
            margin-top: 1.5rem;
        }
    }
    .items {
        display: flex;
        background: var(--gradient-bg);
        border-radius: var(--bs-border-radius);
        padding: 1.625rem 2.25rem;
        .item {
            flex: 1;
            border-left: solid 1px #C5C8D0;
            padding: 0 1.625rem;
            p:last-child {
                margin: 0;
            }
        }
    }
}

#cta-bar {
    padding: 4.5rem 0;
    background-color: var(--bs-white);
    .cta-bar-inner {
        background-color: var(--bs-black);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        color: var(--bs-white);
        border-radius: var(--bs-border-radius);
        overflow: hidden;
        padding: 10rem 3rem 3rem;
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        gap: 6rem;
        .title {
            max-width: 50%;
            h2 {
                margin: 0;
                font-weight: 400;
                color: var(--bs-white);
                strong {
                    font-weight: 700;
                }
            }
        }
        .button .btn {
            white-space: nowrap;
            --bs-btn-color: var(--bs-black);
            --bs-btn-hover-color: var(--bs-black);
            --bs-btn-bg: rgba(var(--bs-primary-rgb),1);
            --bs-btn-border-color: rgba(var(--bs-primary-rgb),1);
        }
    }
}

#offices {
    background-color: var(--bs-black);
    color: var(--bs-light);
    padding: 3.75rem 0 0;
    h2 {
        color: var(--bs-light);
        margin-bottom: 1.375rem;
    }
    .swiper-nav {
        display: flex;
        justify-content: flex-end;
        gap: 1rem;
        margin-bottom: 2.5rem;
        position: relative;
    }
    .swiper-button-next, .swiper-button-prev {
        position: static;
        margin-top: 0;
    }
    #offices-slider {
        padding-bottom: 0;
        .swiper-wrapper {
            margin: 3rem 0 0 0;
        }
        .swiper-slide {
            aspect-ratio: 1/.85;
            position: relative;
            display: flex;
            align-items: flex-end;
            justify-content: space-between;
            padding: 1rem;
            text-decoration: none !important;
            border-radius: var(--bs-border-radius);
            overflow: hidden;
            margin-bottom: .5rem;
            a {
                text-decoration: none;
                width: 100%;
            }
            &::before,
            &::after {
                content: "";
                display: block;
                position: absolute;
                z-index: 2;
                left: 0;
                right: 0;
                bottom: 0;
                height: 140px;
                pointer-events: none;
                opacity: .8;
                background: linear-gradient(to bottom,rgba(5,13,50,0) 0%,rgba(5,13,50,1) 100%);
            }
            &::after {
                opacity: 0;
                background: linear-gradient(to bottom,rgba(5,13,50,0) 40%,rgba(5,13,50,1) 100%);
            }
            .title {
                position: relative;
                z-index: 3;
                width: 100%;
                display: flex;
                align-items: flex-end;
                justify-content: space-between;
                gap: 1rem;
                h3 {
                    color: var(--bs-light);
                    font-size: clamp(1rem, 0.834rem + 0.5312vw, 1.25rem);
                    margin-bottom: 0;
                }
                > svg {
                    flex: 1 0 54px;
                    max-width: 54px;
                    max-height: 54px;
                    transition: all .2s ease-in-out;
                    circle,
                    path {
                        stroke: #F3F5F8;
                    }
                }
            }
            .image {
                position: absolute;
                z-index: 1;
                inset: 0;
                > img {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                }
            }
            &:hover {
                &::after {
                    opacity: .8;
                }
                .title {
                    > svg {
                        transform: rotate(-45deg);
                        circle {
                            stroke: #CFFC51;
                            fill: #CFFC51;
                        }
                        path {
                            stroke: #121317;
                        }
                    }
                }
            }
        }
    }
}

#career-spotlight {
    background-color: var(--bs-white);
    overflow: clip;
    .intro {
        margin-bottom: 2.75rem;
    }
    .swiper {
        overflow: visible;
        padding-bottom: 2.5rem;
    }
    .swiper-slide {
        border-right: solid 1px var(--bs-secondary);
        padding-right: 2.75rem;
        display: flex;
        gap: 3.5rem;
        align-items: flex-start;
        .image {
            flex: 1 0 auto;
            max-width: 30%;
            aspect-ratio: 1/1;
            border-radius: 50%;
            border: solid 1px var(--bs-secondary);
            padding: 13px;
            overflow: hidden;
            img {
                width: 100%;
                height: 100%;
                object-fit: cover;
                border-radius: 50%;
            }
        }
        .name {
            display: flex;
            gap: 1rem;
            a {
                color: var(--bs-heading-color);
            }
        }
        .hired {
            font-size: .95rem;
        }
        .items {
            padding-left: 1rem;
            margin-top: 1.5rem;
        }
        .item {
            font-size: .95rem;
            &:not(:last-child) {
                padding-bottom: 1.5rem;
            }
        }
    }
}

#career-build {
    background-color: var(--bs-white);
    padding: 4.5rem 0;
    h4 {
        font-weight: 400;
    }
    .content {
        border-radius: var(--bs-border-radius);
        padding: 2.75rem;
        overflow: hidden;
        background: var(--gradient-bg);
    }
    .heading {
        display: flex;
        gap: 2.75rem;
        align-items: flex-end;
        margin-bottom: 2.75rem;
    }
}

#leadership {
    background-color: var(--bs-white);
    padding: 0 0 4.5rem 0;
    h4 {
        font-weight: 400;
    }
}

#videos {
    video {
        object-fit: cover;
    }
    .btn {
        --bs-btn-color: var(--bs-black);
        --bs-btn-bg: rgba(237, 238, 241, 0.8);
        --bs-btn-border-color: rgba(237, 238, 241, 0.8);
        --bs-btn-hover-color: var(--bs-black);
        --bs-btn-hover-bg: rgba(var(--bs-primary-rgb),1);
        &.active {
            color: var(--bs-black);
            background-color: rgba(var(--bs-primary-rgb),.5);
            border-color: rgba(var(--bs-primary-rgb),.5);
        }
    }
}

@media (max-width: 991px) {
    #features {
        .items {
            overflow: auto;
            margin: 0 -2.5rem;
            padding: 0 2.5rem;
            gap: 1.625rem;
            .item {
                min-width: 352px;
            }
        }
    }
}
@media (max-width: 575px) {
    #hero {
        min-height: 265px;
        padding: 1.75rem 0;
        .container-fluid {
            max-width: 100dvw;
            overflow: hidden;
        }
        .title {
            padding-bottom: 1.25rem;
            margin-bottom: 1.25rem;
        }
        .button {
            justify-content: flex-start;
            margin: 0 -2.5rem;
            padding: 0 2.5rem;
            .btn-lg {
                font-size: .75rem;
                padding: .5rem 1.25rem;
                flex: 1 0 auto;
            }
        }
    }
    #quote {
        padding: 1.25rem 0;
        .text {
            font-size: 1.25rem;
        }
        .name {
            font-size: 1rem;
        }
    }
    #features {
        padding: 1.25rem 0;
        .container-fluid {
            max-width: 100dvw;
            overflow: hidden;
        }
        .intro {
            margin-bottom: 1.25rem;
        }
        h2 {
            margin-bottom: 1.25rem;
        }
        .items {
            .item {
                min-width: 252px;
            }
            .card {
                --bs-card-spacer-y: 1.25rem;
                --bs-card-spacer-x: 1.25rem;
                .icon {
                    width: 50px;
                    height: 50px;
                    padding: 1rem;
                    margin-bottom: 1.25rem;
                }
                .text {
                    font-size: .8125rem;
                    p:last-child {
                        margin-bottom: 0;
                    }
                }
                .link {
                    a {
                        font-size: .75rem;
                    }
                    svg {
                        width: 15px !important;
                        height: 15px !important;
                    }
                }
            }
        }
    }
    #callout {
        padding: 0;
        .intro {
            margin-bottom: 1.25rem;
        }
        .item {
            .image {
                display: none;
            }
            .content {
                padding: 0;
                max-width: 100%;
                .link {
                    a {
                        font-size: .75rem;
                    }
                    svg {
                        width: 15px !important;
                        height: 15px !important;
                    }
                }
                .button {
                    /* display: none; */
                    margin-top: 1rem;
                    flex-wrap: wrap;
                    .btn {
                        width: 100%;
                    }
                    .btn-lg {
                        --bs-btn-padding-x: 1rem;
                    }
                }
            }
        }
    }
    #values {
        .items {
            &:not(.has-title) {
                .swiper-wrapper {
                    flex-wrap: wrap;
                }
            }
        }
    }
    #accordions {
        .accordion {
            --bs-accordion-btn-icon-width: 2.25rem;
        }
        .features {
            flex-direction: column;
            gap: 1.625rem;
            .item {
                min-width: 252px;
            }
            .icon {
                width: 50px;
                height: 50px;
                padding: 1rem;
                margin-bottom: 1.25rem;
            }
            .text {
                font-size: .8125rem;
                p:last-child {
                    margin-bottom: 0;
                }
            }
        }
    }
    #stats {
        .items {
            flex-wrap: wrap;
            .item {
                flex: 1 0 auto;
                width: 100%;
                &:not(:last-child) {
                    padding-bottom: 1.5rem;
                }
            }
        }
    }
    #cta-bar {
        padding: 1rem 0;
        .cta-bar-inner {
            background-position: left center;
            padding: 8.25rem 1rem 1.75rem;
            flex-direction: column;
            align-items: flex-start;
            gap: 1.25rem;
            .title {
                max-width: 100%;
            }
        }
    }
    #offices {
        padding: 2.5rem 0 0;
        #offices-slider {
            .swiper-wrapper {
                margin: 0;
            }
        }
    }
    #career-spotlight {
        .swiper-slide {
            padding-right: 1.75rem;
            gap: 1.25rem;
            flex-direction: column;
            .image {
                max-width: 60%;
            }
        }
    }
    #career-build {
        .text {
            padding: 1.25rem;
        }
    }
}