.customer-path-heading {
    width: 100%;
    padding-bottom: 50px;
    background: #fff;
    font-style: normal;
}

.customer-path-heading__container { padding-inline: 20px; }

.customer-path-heading__breadcrumbs > div {
    gap: 10px;
    padding-block: 20px 10px;
    color: #004884;
    font-size: 12px;
    line-height: 1.6;
}

.customer-path-heading__hero {
    position: relative;
    min-height: 316px;
    overflow: hidden;
    border-radius: 20px;
    background: #d9d9d9;
}

.customer-path-heading__image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: left center;
}

.customer-path-heading__content {
    position: relative;
    display: flex;
    min-height: inherit;
    flex-direction: column;
    justify-content: space-between;
    gap: 30px;
    padding: 30px 20px;
}

.customer-path-heading__title {
    max-width: 650px;
    margin: 0;
    color: #fff;
    font-size: 28px;
    font-weight: 600;
    font-style: normal;
    line-height: 1;
    overflow-wrap: anywhere;
}

.customer-path-heading__title :is(b, strong) { font-weight: inherit; }

.customer-path-heading__buttons {
    display: flex;
    width: 100%;
    flex-direction: column;
    gap: 10px;
}

.customer-path-heading__button {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-inline: 20px;
    border-radius: 10px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
    text-decoration: none;
    overflow-wrap: anywhere;
    transition: background-color 150ms;
}

.customer-path-heading__button--white { background: #fff; color: #003466; }
.customer-path-heading__button--gold { background: linear-gradient(99deg, #e4b65d 13.6%, #f5d27a 52.99%, #f7f5cc 91.56%); color: #000; }
.customer-path-heading__button:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }

.customer-path-heading__badges {
    display: grid;
    width: 100vw;
    min-width: 0;
    gap: 15px;
    margin-top: 20px;
    margin-inline: calc(50% - 50vw);
}

.customer-path-heading__badge-row {
    min-width: 0;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    overflow-anchor: none;
    scroll-behavior: auto;
    scrollbar-width: none;
    cursor: grab;
    user-select: none;
}

.customer-path-heading__badge-row::-webkit-scrollbar { display: none; }
.customer-path-heading__badge-row:focus-visible { outline: 2px solid #0579db; outline-offset: -2px; }
.customer-path-heading__badge-row--dragging { cursor: grabbing; }

.customer-path-heading__badge-track {
    display: flex;
    width: max-content;
}

.customer-path-heading__badge-group {
    display: flex;
    flex-shrink: 0;
    gap: 10px;
    padding-right: 10px;
}

.customer-path-heading__badge {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    padding: 7px 19px;
    border: 1px solid transparent;
    border-radius: 100px;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.6;
    white-space: nowrap;
}

.customer-path-heading__badge--transparent { border-color: #004884; color: #004884; }

@media (min-width: 768px) and (max-width: 1279px) {
    .customer-path-heading__container { padding-inline: 30px; }
    .customer-path-heading__breadcrumbs > div { padding-block: 30px 15px; }
    .customer-path-heading__hero { min-height: 296px; }
    .customer-path-heading__content { justify-content: flex-start; padding: 50px 30px; }
    .customer-path-heading__buttons { max-width: 315px; }
}

@media (min-width: 1280px) {
    .customer-path-heading__container { padding-inline: 50px; }
    .customer-path-heading__breadcrumbs > div { padding-block: 30px 15px; }
    .customer-path-heading__hero { min-height: 310px; }
    .customer-path-heading__image { object-position: center; }
    .customer-path-heading__content { justify-content: flex-start; padding: 50px 70px; }
    .customer-path-heading__title { font-size: 60px; }
    .customer-path-heading__buttons { width: auto; flex-direction: row; flex-wrap: wrap; gap: 20px; }
    .customer-path-heading__button { padding-inline: 50px; }
    .customer-path-heading__badges { gap: 10px; margin-top: 30px; }
    .customer-path-heading__badge { padding-block: 9px; }
}
