@charset "UTF-8";

@import url("loadingSpinner.css");
@import url("onThisPageNav.css");
@import url("videoShowcaseCarousel.css");
@import url("listingWithDetailPanel.css");
@import url("contentIntroduction.css");
@import url("categorizedCardsGrid.css");
@import url("loadingSpinner.css");
@import url("fAQPromptBanner.css");
@import url("iconWithNoticeBlockFullWidth.css");
@import url("iconWithNoticeBlockConstrainedWidth.css");
@import url("inlineCallout.css");
@import url("leadParagraph.css");
@import url("subTitleWithMainTitle.css");
@import url("threeColumnTextBlock.css");
@import url("timelineTextBlock.css");
@import url("pdfViewer.css");
@import url("legalStructureCards.css");
@import url("skeletonLoading.css");
@import url("imageTextVertical.css");
@import url("imageGridwithTextOverlays.css");
@import url("usefulLinks.css");
@import url("noResults.css");
@import url("formPopup.css");
@import url("sectionHeader.css");
@import url("statsRow.css");
@import url("standardCards.css");
@import url("numberedEditorialList.css");
@import url("iconCards.css");
@import url("articleCards.css");
@import url("darkCards.css");
@import url("reportPublicationCoverCards.css");
@import url("roundedCornerCtaBanner.css");
@import url("sectionContentCtaRow.css");
@import url("columnHeadingDualBullets.css");
@import url("formattedTextContent.css");
@import url("trustCredibilityAwardBadgesCardGrid.css");
@import url("certificationBadges.css");
@import url("cardCarousel.css");
@import url("startAtQfcCarousel.css");
@import url("eventsCarousel.css");
@import url("textTicker.css");
@import url("heroCarousel.css");
@import url("pdfEmbedViewer.css");
@import url("categoryTagListing.css");
@import url("bigHeadlineExpandableTiles.css");
@import url("documentsDownload.css");
@import url("keyFactsInfoBox.css");
@import url("featureCard.css");
@import url("verticalTabRail.css");
@import url("partnerLogoGrid.css");
@import url("imageGalleryGrid.css");
@import url("adjacentFeatureCard.css");
@import url("heroBlock.css");
@import url("testimonialCards.css");
@import url("comparison.css");
@import url("logoGridWithIndividualCtAs.css");
@import url("fAQsList.css");
@import url("faq.css");
@import url("regulatoryStatusIndicators.css");
@import url("mediaGalaryList.css");
@import url("formPages.css");
@import url("gradientCtaBanner.css");
@import url("KeyAdvantagesTabs.css");
@import url("miniVideoShowcaseCarousel.css");
@import url("onetrust.css");

/* Perf: skip layout/paint work for block sections until they're near the viewport */
main > section {
    content-visibility: auto;
    contain-intrinsic-size: auto 500px;
}

.alert-primary {
    --bs-alert-color: var(--bs-primary-text);
    --bs-alert-bg: var(--bs-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-primary-border-subtle);
    --bs-alert-link-color: var(--bs-primary-text);
}

.alert-white {
    --bs-alert-color: var(--bs-white-text);
    --bs-alert-bg: var(--bs-white-bg-subtle);
    --bs-alert-border-color: var(--bs-white-border-subtle);
    --bs-alert-link-color: var(--bs-white-text);
}

.alert-black {
    --bs-alert-color: var(--bs-black-text);
    --bs-alert-bg: var(--bs-black-bg-subtle);
    --bs-alert-border-color: var(--bs-black-border-subtle);
    --bs-alert-link-color: var(--bs-black-text);
}

.alert-secondary {
    --bs-alert-color: var(--bs-secondary-text);
    --bs-alert-bg: var(--bs-secondary-bg-subtle);
    --bs-alert-border-color: var(--bs-secondary-border-subtle);
    --bs-alert-link-color: var(--bs-secondary-text);
}

.alert-light-primary {
    --bs-alert-color: var(--bs-light-primary-text);
    --bs-alert-bg: var(--bs-light-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-light-primary-border-subtle);
    --bs-alert-link-color: var(--bs-light-primary-text);
}

.alert-light-bg {
    --bs-alert-color: var(--bs-light-bg-text);
    --bs-alert-bg: var(--bs-light-bg-bg-subtle);
    --bs-alert-border-color: var(--bs-light-bg-border-subtle);
    --bs-alert-link-color: var(--bs-light-bg-text);
}

.alert-grey {
    --bs-alert-color: var(--bs-grey-text);
    --bs-alert-bg: var(--bs-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-grey-border-subtle);
    --bs-alert-link-color: var(--bs-grey-text);
}

.alert-purple {
    --bs-alert-color: var(--bs-purple-text);
    --bs-alert-bg: var(--bs-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-purple-border-subtle);
    --bs-alert-link-color: var(--bs-purple-text);
}

.alert-dark-purple {
    --bs-alert-color: var(--bs-dark-purple-text);
    --bs-alert-bg: var(--bs-dark-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-purple-border-subtle);
    --bs-alert-link-color: var(--bs-dark-purple-text);
}

.alert-violet {
    --bs-alert-color: var(--bs-violet-text);
    --bs-alert-bg: var(--bs-violet-bg-subtle);
    --bs-alert-border-color: var(--bs-violet-border-subtle);
    --bs-alert-link-color: var(--bs-violet-text);
}

.alert-dark-grey {
    --bs-alert-color: var(--bs-dark-grey-text);
    --bs-alert-bg: var(--bs-dark-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-grey-border-subtle);
    --bs-alert-link-color: var(--bs-dark-grey-text);
}

.alert-light-black {
    --bs-alert-color: var(--bs-light-black-text);
    --bs-alert-bg: var(--bs-light-black-bg-subtle);
    --bs-alert-border-color: var(--bs-light-black-border-subtle);
    --bs-alert-link-color: var(--bs-light-black-text);
}

.alert-border-color {
    --bs-alert-color: var(--bs-border-color-text);
    --bs-alert-bg: var(--bs-border-color-bg-subtle);
    --bs-alert-border-color: var(--bs-border-color-border-subtle);
    --bs-alert-link-color: var(--bs-border-color-text);
}

.alert-grey1 {
    --bs-alert-color: var(--bs-grey1-text);
    --bs-alert-bg: var(--bs-grey1-bg-subtle);
    --bs-alert-border-color: var(--bs-grey1-border-subtle);
    --bs-alert-link-color: var(--bs-grey1-text);
}

.alert-grey2 {
    --bs-alert-color: var(--bs-grey2-text);
    --bs-alert-bg: var(--bs-grey2-bg-subtle);
    --bs-alert-border-color: var(--bs-grey2-border-subtle);
    --bs-alert-link-color: var(--bs-grey2-text);
}

.alert-gray-color {
    --bs-alert-color: var(--bs-gray-color-text);
    --bs-alert-bg: var(--bs-gray-color-bg-subtle);
    --bs-alert-border-color: var(--bs-gray-color-border-subtle);
    --bs-alert-link-color: var(--bs-gray-color-text);
}

.alert-gray3 {
    --bs-alert-color: var(--bs-gray3-text);
    --bs-alert-bg: var(--bs-gray3-bg-subtle);
    --bs-alert-border-color: var(--bs-gray3-border-subtle);
    --bs-alert-link-color: var(--bs-gray3-text);
}

.alert-light-grey {
    --bs-alert-color: var(--bs-light-grey-text);
    --bs-alert-bg: var(--bs-light-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-light-grey-border-subtle);
    --bs-alert-link-color: var(--bs-light-grey-text);
}

.bg-primary {
    background: var(--primary) !important;
}

.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
    }

.btn-outline-primary {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary-accent);
}

    .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
        box-shadow: none;
        outline: none;
    }

.text-primary {
    color: var(--primary-accent) !important;
}

.bg-white {
    background: var(--surface) !important;
}

.btn-white {
    background: var(--surface);
    border-color: var(--on-primary);
}

    .btn-white:hover, .btn-white:focus, .btn-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
    }

.btn-outline-white {
    background: transparent;
    border-color: var(--on-primary);
    color: var(--on-primary);
}

    .btn-outline-white:hover, .btn-outline-white:focus, .btn-outline-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
        box-shadow: none;
        outline: none;
    }

.text-white {
    color: var(--on-primary) !important;
}

.bg-black {
    background: var(--black) !important;
}

.btn-black {
    background: var(--black);
    border-color: var(--black);
}

    .btn-black:hover, .btn-black:focus, .btn-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
    }

.btn-outline-black {
    background: transparent;
    border-color: var(--black);
    color: var(--text);
}

    .btn-outline-black:hover, .btn-outline-black:focus, .btn-outline-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
        box-shadow: none;
        outline: none;
    }

.text-black {
    color: var(--text) !important;
}

.bg-secondary {
    background: var(--text-muted) !important;
}

.btn-secondary {
    background: var(--text-muted);
    border-color: var(--text-muted);
}

    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
    }

.btn-outline-secondary {
    background: transparent;
    border-color: var(--text-muted);
    color: var(--text-muted);
}

    .btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
        box-shadow: none;
        outline: none;
    }

.text-secondary {
    color: var(--text-muted) !important;
}

.bg-light-primary {
    background: var(--light-primary) !important;
}

.btn-light-primary {
    background: var(--light-primary);
    border-color: var(--light-primary);
}

    .btn-light-primary:hover, .btn-light-primary:focus, .btn-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
    }

.btn-outline-light-primary {
    background: transparent;
    border-color: var(--light-primary);
    color: var(--light-primary);
}

    .btn-outline-light-primary:hover, .btn-outline-light-primary:focus, .btn-outline-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
        box-shadow: none;
        outline: none;
    }

.text-light-primary {
    color: var(--light-primary) !important;
}

.bg-light-bg {
    background: var(--light-bg) !important;
}

.btn-light-bg {
    background: var(--light-bg);
    border-color: var(--light-bg);
}

    .btn-light-bg:hover, .btn-light-bg:focus, .btn-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
    }

.btn-outline-light-bg {
    background: transparent;
    border-color: var(--light-bg);
    color: var(--light-bg);
}

    .btn-outline-light-bg:hover, .btn-outline-light-bg:focus, .btn-outline-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
        box-shadow: none;
        outline: none;
    }

.text-light-bg {
    color: var(--light-bg) !important;
}

.bg-grey {
    background: var(--grey) !important;
}

.btn-grey {
    background: var(--grey);
    border-color: var(--grey);
}

    .btn-grey:hover, .btn-grey:focus, .btn-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
    }

.btn-outline-grey {
    background: transparent;
    border-color: var(--grey);
    color: var(--grey);
}

    .btn-outline-grey:hover, .btn-outline-grey:focus, .btn-outline-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
        box-shadow: none;
        outline: none;
    }

.text-grey {
    color: var(--grey) !important;
}

.bg-purple {
    background: var(--purple) !important;
}

.btn-purple {
    background: var(--purple);
    border-color: var(--purple);
}

    .btn-purple:hover, .btn-purple:focus, .btn-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
    }

.btn-outline-purple {
    background: transparent;
    border-color: var(--purple);
    color: var(--purple);
}

    .btn-outline-purple:hover, .btn-outline-purple:focus, .btn-outline-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
        box-shadow: none;
        outline: none;
    }

.text-purple {
    color: var(--purple) !important;
}

.bg-dark-purple {
    background: var(--dark-purple) !important;
}

.btn-dark-purple {
    background: var(--dark-purple);
    border-color: var(--dark-purple);
}

    .btn-dark-purple:hover, .btn-dark-purple:focus, .btn-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
    }

.btn-outline-dark-purple {
    background: transparent;
    border-color: var(--dark-purple);
    color: var(--dark-purple);
}

    .btn-outline-dark-purple:hover, .btn-outline-dark-purple:focus, .btn-outline-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
        box-shadow: none;
        outline: none;
    }

.text-dark-purple {
    color: var(--dark-purple) !important;
}

.bg-violet {
    background: var(--violet) !important;
}

.btn-violet {
    background: var(--violet);
    border-color: var(--violet);
}

    .btn-violet:hover, .btn-violet:focus, .btn-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
    }

.btn-outline-violet {
    background: transparent;
    border-color: var(--violet);
    color: var(--primary-accent);
}

    .btn-outline-violet:hover, .btn-outline-violet:focus, .btn-outline-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
        box-shadow: none;
        outline: none;
    }

.text-violet {
    color: var(--primary-accent) !important;
}

.bg-dark-grey {
    background: var(--dark-grey) !important;
}

.btn-dark-grey {
    background: var(--dark-grey);
    border-color: var(--dark-grey);
}

    .btn-dark-grey:hover, .btn-dark-grey:focus, .btn-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
    }

.btn-outline-dark-grey {
    background: transparent;
    border-color: var(--dark-grey);
    color: var(--dark-grey);
}

    .btn-outline-dark-grey:hover, .btn-outline-dark-grey:focus, .btn-outline-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
        box-shadow: none;
        outline: none;
    }

.text-dark-grey {
    color: var(--dark-grey) !important;
}

.bg-light-black {
    background: var(--light-black) !important;
}

.btn-light-black {
    background: var(--light-black);
    border-color: var(--light-black);
}

    .btn-light-black:hover, .btn-light-black:focus, .btn-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
    }

.btn-outline-light-black {
    background: transparent;
    border-color: var(--light-black);
    color: var(--light-black);
}

    .btn-outline-light-black:hover, .btn-outline-light-black:focus, .btn-outline-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
        box-shadow: none;
        outline: none;
    }

.text-light-black {
    color: var(--light-black) !important;
}

.bg-border-color {
    background: var(--border-color) !important;
}

.btn-border-color {
    background: var(--border-color);
    border-color: var(--border-color);
}

    .btn-border-color:hover, .btn-border-color:focus, .btn-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
    }

.btn-outline-border-color {
    background: transparent;
    border-color: var(--border-color);
    color: var(--border-color);
}

    .btn-outline-border-color:hover, .btn-outline-border-color:focus, .btn-outline-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
        box-shadow: none;
        outline: none;
    }

.text-border-color {
    color: var(--border-color) !important;
}

.bg-grey1 {
    background: var(--grey1) !important;
}

.btn-grey1 {
    background: var(--grey1);
    border-color: var(--grey1);
}

    .btn-grey1:hover, .btn-grey1:focus, .btn-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
    }

.btn-outline-grey1 {
    background: transparent;
    border-color: var(--grey1);
    color: var(--grey1);
}

    .btn-outline-grey1:hover, .btn-outline-grey1:focus, .btn-outline-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
        box-shadow: none;
        outline: none;
    }

.text-grey1 {
    color: var(--grey1) !important;
}

.bg-grey2 {
    background: var(--grey2) !important;
}

.btn-grey2 {
    background: var(--grey2);
    border-color: var(--grey2);
}

    .btn-grey2:hover, .btn-grey2:focus, .btn-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
    }

.btn-outline-grey2 {
    background: transparent;
    border-color: var(--grey2);
    color: var(--grey2);
}

    .btn-outline-grey2:hover, .btn-outline-grey2:focus, .btn-outline-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
        box-shadow: none;
        outline: none;
    }

.text-grey2 {
    color: var(--grey2) !important;
}

.bg-gray-color {
    background: var(--gray-color) !important;
}

.btn-gray-color {
    background: var(--gray-color);
    border-color: var(--gray-color);
}

    .btn-gray-color:hover, .btn-gray-color:focus, .btn-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
    }

.btn-outline-gray-color {
    background: transparent;
    border-color: var(--gray-color);
    color: var(--gray-color);
}

    .btn-outline-gray-color:hover, .btn-outline-gray-color:focus, .btn-outline-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
        box-shadow: none;
        outline: none;
    }

.text-gray-color {
    color: var(--gray-color) !important;
}

.bg-gray3 {
    background: var(--gray3) !important;
}

.btn-gray3 {
    background: var(--gray3);
    border-color: var(--gray3);
}

    .btn-gray3:hover, .btn-gray3:focus, .btn-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
    }

.btn-outline-gray3 {
    background: transparent;
    border-color: var(--gray3);
    color: var(--gray3);
}

    .btn-outline-gray3:hover, .btn-outline-gray3:focus, .btn-outline-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
        box-shadow: none;
        outline: none;
    }

.text-gray3 {
    color: var(--gray3) !important;
}

.bg-light-grey {
    background: var(--light-grey) !important;
}

.btn-light-grey {
    background: var(--light-grey);
    border-color: var(--light-grey);
}

    .btn-light-grey:hover, .btn-light-grey:focus, .btn-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
    }

.btn-outline-light-grey {
    background: transparent;
    border-color: var(--light-grey);
    color: var(--light-grey);
}

    .btn-outline-light-grey:hover, .btn-outline-light-grey:focus, .btn-outline-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
        box-shadow: none;
        outline: none;
    }

.text-light-grey {
    color: var(--light-grey) !important;
}

.fs-56 {
    font-size: clamp(30px, 30px + 0vw, 30px);
}

@media (min-width: 768px) {
    .fs-56 {
        font-size: clamp(30px, 30px + 0vw, 30px);
    }
}

@media (min-width: 1200px) {
    .fs-56 {
        font-size: clamp(30px, -13.3333333333px + 3.6111111111vw, 56px);
    }
}

.fs-40 {
    font-size: clamp(18px, 13.7142857143px + 1.3392857143vw, 24px);
}

@media (min-width: 768px) {
    .fs-40 {
        font-size: clamp(24px, 24px + 0vw, 24px);
    }
}

@media (min-width: 1200px) {
    .fs-40 {
        font-size: clamp(24px, -2.6666666667px + 2.2222222222vw, 40px);
    }
}

.fs-38 {
    font-size: clamp(18px, 15.1428571429px + 0.8928571429vw, 22px);
}

@media (min-width: 768px) {
    .fs-38 {
        font-size: clamp(22px, 22px + 0vw, 22px);
    }
}

@media (min-width: 1200px) {
    .fs-38 {
        font-size: clamp(22px, -4.6666666667px + 2.2222222222vw, 38px);
    }
}

.fs-32 {
    font-size: clamp(18px, 16.5714285714px + 0.4464285714vw, 20px);
}

@media (min-width: 768px) {
    .fs-32 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .fs-32 {
        font-size: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.fs-28 {
    font-size: clamp(16px, 14.5714285714px + 0.4464285714vw, 18px);
}

@media (min-width: 768px) {
    .fs-28 {
        font-size: clamp(18px, 18px + 0vw, 18px);
    }
}

@media (min-width: 1200px) {
    .fs-28 {
        font-size: clamp(18px, 1.3333333333px + 1.3888888889vw, 28px);
    }
}

.fs-24 {
    font-size: clamp(16px, 16px + 0vw, 16px);
}

@media (min-width: 768px) {
    .fs-24 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-24 {
        font-size: clamp(16px, 2.6666666667px + 1.1111111111vw, 24px);
    }
}

.fs-22 {
    font-size: clamp(14px, 12.5714285714px + 0.4464285714vw, 16px);
}

@media (min-width: 768px) {
    .fs-22 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-22 {
        font-size: clamp(16px, 6px + 0.8333333333vw, 22px);
    }
}

.fs-20 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-20 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-20 {
        font-size: clamp(12px, -1.3333333333px + 1.1111111111vw, 20px);
    }
}

.fs-18 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-18 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-18 {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

.fs-16 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-16 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-16 {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

.fs-15 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-15 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-15 {
        font-size: clamp(12px, 7px + 0.4166666667vw, 15px);
    }
}

.fs-14 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-14 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-14 {
        font-size: clamp(10px, 3.3333333333px + 0.5555555556vw, 14px);
    }
}

.fs-12 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-12 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-12 {
        font-size: clamp(10px, 6.6666666667px + 0.2777777778vw, 12px);
    }
}

.section-title {
    text-align: start;
    text-transform: none;
    font-weight: 600 !important;
    color: var(--primary-accent);
}

.section-title-color {
    color: var(--primary-accent);
}

@media (max-width: 767.98px) {
    .section-title {
        margin-bottom: 24px !important;
    }
}

@media (max-width: 991.98px) {
    .section-title {
        padding-inline: 0 !important;
    }
}

.sub-title {
    text-transform: none;
    text-align: start;
    color: var(--text-muted);
}

.breadcrumb-menu {
    background-color: var(--surface-2);
    border: 1px solid var(--border-color);
    padding: 18px 0;
}

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
        content: var(--bs-breadcrumb-divider, ">");
        color: var(--purple);
        float: inline-start !important;
        padding-inline-end: var(--bs-breadcrumb-item-padding-x) !important;
    }

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item a {
        font-weight: 400;
        font-size: 16px;
        line-height: 19px;
        letter-spacing: -0.18px;
        color: var(--text-muted);
    }

        .breadcrumb-menu nav .breadcrumb .breadcrumb-item a.active {
            color: var(--purple);
        }

@media (min-width: 992px) {
    body:has(.inner-banner) header:not(.sticky-header) {
        background-color: transparent !important;
        position: absolute;
        width: 100%;
        z-index: 10;
    }

        body:has(.inner-banner) header:not(.sticky-header) .navbar {
            border: none;
        }

        body:has(.inner-banner) header:not(.sticky-header) .navbar-brand .inner-logo {
            display: block !important;
        }

        body:has(.inner-banner) header:not(.sticky-header) .navbar-brand .main-logo {
            display: none !important;
        }

        body:has(.inner-banner) header:not(.sticky-header) .navbar .nav-item {
            color: var(--on-primary) !important;
        }

            body:has(.inner-banner) header:not(.sticky-header) .navbar .nav-item.btn {
                background-color: var(--surface) !important;
                background: var(--surface) !important;
                color: var(--primary-accent) !important;
                transition: none !important;
            }

                body:has(.inner-banner) header:not(.sticky-header) .navbar .nav-item.btn i {
                    color: var(--primary-accent) !important;
                }

                body:has(.inner-banner) header:not(.sticky-header) .navbar .nav-item.btn:hover {
                    background-color: var(--violet) !important;
                    background: var(--violet) !important;
                    color: var(--on-primary) !important;
                }

        body:has(.inner-banner) header:not(.sticky-header) .navbar-nav .sub-menu .nav-item {
            color: var(--text-muted) !important;
        }

        body:has(.inner-banner) header:not(.sticky-header) .navbar #search-btn {
            background: var(--surface) !important;
            border: 1px solid var(--secondary) !important;
        }

            body:has(.inner-banner) header:not(.sticky-header) .navbar #search-btn input {
                background: transparent !important;
            }

            body:has(.inner-banner) header:not(.sticky-header) .navbar #search-btn i {
                color: var(--primary-accent) !important;
            }
}

body:has(.inner-banner) .top-nav .access-normal {
    display: none;
}

body:has(.inner-banner) .top-nav .access-white {
    display: block !important;
}

body:has(.inner-banner) header .nav-item:has(.access-white) {
    display: inline-flex;
}

@media (min-width: 992px) {
    body:has(.inner-banner.large) header:not(.sticky-header) {
        background-color: rgba(0, 0, 0, 0.0509803922) !important;
        backdrop-filter: blur(14px);
    }
}

@media (min-width: 992px) {
    body:has(.inner-banner) header.site-header {
        top: 0rem;
    }

        body:has(.inner-banner) header.site-header .main-nav {
            background-color: transparent;
        }

            body:has(.inner-banner) header.site-header .main-nav::before {
                border-radius: 30px;
            }

            body:has(.inner-banner) header.site-header .main-nav #navbarSupportedContent .navbar-nav .nav-item .nav-link {
                color: var(--on-primary);
            }

    header.site-header .main-nav .navbar-brand img.light {
        display: none;
    }

    body:has(.inner-banner) header.site-header .main-nav .navbar-brand img.light {
        display: block;
    }

    body:has(.inner-banner) header.site-header .main-nav .navbar-brand img.dark {
        display: none;
    }

    body:has(.inner-banner) header.site-header .search-btn {
        background-color: var(--surface);
    }

    body:has(.inner-banner) header.site-header.is-scrolled:not(.sticky-header) {
        position: fixed;
        background-color: var(--surface) !important;
        top: 0;
    }

        body:has(.inner-banner) header.site-header.is-scrolled:not(.sticky-header) .main-nav #navbarSupportedContent .navbar-nav .nav-item .nav-link {
            color: var(--text-muted);
        }

        body:has(.inner-banner) header.site-header.is-scrolled:not(.sticky-header) .main-nav .navbar-brand img.light {
            display: none;
        }

        body:has(.inner-banner) header.site-header.is-scrolled:not(.sticky-header) .main-nav .navbar-brand img.dark {
            display: block;
        }

    body:has(.inner-banner) header.site-header.is-scrolled.is-hidden:not(.sticky-header) {
        position: fixed;
        background-color: var(--surface) !important;
        transform: translateY(-100%);
    }

    body:has(.inner-banner) header.site-header.sticky-header {
        top: 0;
    }

    body:not(.search-open):has(.inner-banner) header.site-header.sticky-header {
        background-color: var(--surface) !important;
    }

        body:has(.inner-banner) header.site-header.sticky-header .main-nav #navbarSupportedContent .navbar-nav .nav-item .nav-link {
            color: var(--text-muted);
        }

        body:has(.inner-banner) header.site-header.sticky-header .main-nav .navbar-brand img.light {
            display: none;
        }

        body:has(.inner-banner) header.site-header.sticky-header .main-nav .navbar-brand img.dark {
            display: block;
        }

        body:has(.inner-banner) header.site-header.sticky-header .search-btn {
            background-color: transparent;
        }
}

html.dark-mode .search-btn img,
html.dark-mode #search-input img {
    filter: brightness(2.5);
}

@media (min-width: 992px) {
    body.search-open:has(.inner-banner) header.site-header.is-scrolled {
        position: fixed;
    }

    body.search-open:has(.inner-banner) header.site-header.is-scrolled,
    body.search-open:has(.inner-banner) header.site-header.sticky-header {
        background-color: transparent !important;
        box-shadow: none !important;
    }

        body.search-open:has(.inner-banner) header.site-header.is-scrolled .main-nav #navbarSupportedContent .navbar-nav .nav-item .nav-link,
        body.search-open:has(.inner-banner) header.site-header.sticky-header .main-nav #navbarSupportedContent .navbar-nav .nav-item .nav-link {
            color: var(--on-primary);
        }

        body.search-open:has(.inner-banner) header.site-header.is-scrolled .main-nav .navbar-brand img.light,
        body.search-open:has(.inner-banner) header.site-header.sticky-header .main-nav .navbar-brand img.light {
            display: block;
        }

        body.search-open:has(.inner-banner) header.site-header.is-scrolled .main-nav .navbar-brand img.dark,
        body.search-open:has(.inner-banner) header.site-header.sticky-header .main-nav .navbar-brand img.dark {
            display: none;
        }

        body.search-open:has(.inner-banner) header.site-header.is-scrolled .search-btn,
        body.search-open:has(.inner-banner) header.site-header.sticky-header .search-btn {
            background-color: var(--surface);
        }

    body.search-open:not(:has(.inner-banner)) header.site-header.is-scrolled .main-nav,
    body.search-open:not(:has(.inner-banner)) header.site-header.sticky-header .main-nav {
        background-color: color-mix(in srgb, var(--surface) 90%, transparent);
    }
}



@media (min-width: 1600px) and (max-width: 1807.98px) {
    .site-header .container-lg {
        padding-inline: 2rem;
    }
}

#main-header.site-header .main-nav .navbar-brand img {
    width: clamp(165px, 152px + 3.3333vw, 200px);
    height: auto;
    aspect-ratio: 200 / 61;
    object-fit: contain;
}

header.site-header {
    transition: transform 0.6s ease, background-color 0.3s ease, top 0.6s ease !important;
}

    header.site-header.is-scrolled.is-hidden {
        transform: none !important;
        top: calc(-1 * var(--header-height, 144px)) !important;
    }

body:not(.search-open) header.site-header.is-scrolled,
body:not(.search-open) header.site-header.is-scrolled.is-hidden {
    background-color: var(--surface) !important;
}

.inner-banner figure {
    position: relative;
}

    .inner-banner figure img {
        width: 100%;
        object-fit: cover;
        height: 625px;
    }

.inner-banner .overlay {
    background: linear-gradient(87.48deg, rgba(61, 18, 107, 0.9) -18.26%, rgba(61, 18, 107, 0) 135.36%);
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
}

.inner-banner-holder:not(.inner-banner-normal) {
    height: 625px;
}

    .inner-banner-holder:not(.inner-banner-normal) .banner-title {
        bottom: 0;
        padding-top: 143px;
        justify-content: center;
    }

.inner-banner-normal {
    height: 372px;
    align-self: stretch;
    background: var(--Others-Header, linear-gradient(84deg, var(--colors-brand-primary-indigo-indigo-100, var(--violet)) -8.18%, #A88BC8 81.98%));
}

    .inner-banner-normal::after {
        content: "";
        position: absolute;
        inset-inline-end: 0;
        background: url("../images/icons/header-pattern.png") no-repeat top right;
        background-size: auto 127%;
        width: 100%;
        height: 100%;
        top: 0;
        opacity: 0.09;
    }

    .inner-banner-normal > .container-lg,
    .inner-banner-normal > .container-lg > .row {
        height: 100%;
    }

    .inner-banner-normal .banner-title {
        position: relative !important;
        bottom: 70px;
        justify-content: end;
    }

/* Compact height + image: keep the image within the compact banner and crop it
       from the bottom only, so it no longer overflows onto the content below. */
.inner-banner-holder.inner-banner-normal figure {
    position: absolute;
    inset: 0;
    height: 100%;
    margin: 0;
    overflow: hidden;
}

    .inner-banner-holder.inner-banner-normal figure img {
        height: 100%;
        object-fit: cover;
        object-position: top;
    }

/* When an image is present, drop the header-pattern overlay. */
.inner-banner-holder.inner-banner-normal:has(figure)::after {
    content: none;
}

@media (max-width: 767.98px) {
    .inner-banner:has(.inner-banner-normal),
    .inner-banner-normal {
        height: 260px;
    }

        .inner-banner-normal::after {
            background-size: auto 100%;
        }

        .inner-banner-normal .banner-title {
            bottom: 32px;
        }

            .inner-banner-normal .banner-title .section-title {
                font-size: 28px;
            }
}

.inner-banner-white {
    height: auto;
}

.inner-banner .banner-title {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: start;
    height: 100%;
    z-index: 7;
}

    .inner-banner .banner-title h4 {
        font-size: 56px;
        color: var(--on-primary) !important;
        margin-bottom: 20px;
    }

    .inner-banner .banner-title p {
        color: var(--on-primary) !important;
        margin-bottom: 20px;
    }

@media (max-width: 1199.98px) {
    .inner-banner .banner-title h4 {
        font-size: 36px;
    }

    .inner-banner .banner-title p {
        font-size: 18px !important;
    }
}

@media (max-width: 767.98px) {
    .inner-banner .banner-title h4 {
        font-size: 24px;
    }

    .inner-banner .banner-title p {
        font-size: 15px !important;
    }
}

@media (max-width: 1199.98px) {
    .inner-banner.large {
        height: auto;
    }
}

.inner-banner.large .container-lg,
.inner-banner.large .container-lg > .row {
    height: auto;
}

@media (min-width: 1200px) {
    .inner-banner.large .inner-banner-holder {
        height: 935px;
    }
}

.inner-banner.large .inner-banner-holder .btn {
    width: 207px;
}

.inner-banner.large .inner-banner-holder::after {
    background: url("../images/icons/header-pattern.png") no-repeat top right;
}

.inner-banner.large .breadcrumb-menu {
    margin-top: 143px;
    background-color: transparent !important;
    border: none !important;
}

.inner-banner.large .breadcrumb-item::before {
    color: rgba(255, 255, 255, 0.6) !important;
}

.inner-banner.large .breadcrumb-item a {
    color: rgba(255, 255, 255, 0.6) !important;
}

    .inner-banner.large .breadcrumb-item a.active {
        color: var(--on-primary) !important;
    }

.inner-banner.large .banner-title {
    align-items: center !important;
    justify-content: start !important;
    top: 46px !important;
    bottom: unset !important;
    height: max-content !important;
}

    .inner-banner.large .banner-title h4,
    .inner-banner.large .banner-title p {
        text-align: center;
    }

@media (max-width: 1199.98px) {
    .inner-banner {
        height: 375px;
    }

        .inner-banner .inner-banner-holder {
            height: 100%;
        }
}

@media (max-width: 1199.98px) {
    .inner-banner figure,
    .inner-banner figure img {
        height: 100%;
    }
}

html[dir=rtl] .inner-banner-normal {
    background: linear-gradient(271.8deg, rgb(61, 18, 107) -42.84%, rgb(94, 60, 129) 79.29%);
}

    html[dir=rtl] .inner-banner-normal::after {
        transform: scaleX(-1);
    }

.cardSwiper {
    padding-bottom: 60px !important;
}

@media (max-width: 767.98px) {
    .cardSwiper {
        margin-top: 0 !important;
    }
}

.cardSwiper.swiper {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-block-end: 5rem;
    padding-inline-start: 0;
    padding-inline-end: 0;
}

    .cardSwiper.swiper .swiper-pagination {
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 10px 18px;
        width: auto;
        height: 45px;
        background: rgba(174, 174, 174, 0.2);
        border-radius: 98px;
        left: unset;
        bottom: 0px;
    }

@media (max-width: 767px) {
    .cardSwiper.swiper .swiper-pagination {
        height: 38px;
        padding: 5px 5px;
    }
}

.cardSwiper.swiper .swiper-pagination .swiper-pagination-bullet {
    width: 14px;
    height: 14px;
    background: var(--surface) !important;
    opacity: 1;
}

@media (max-width: 767px) {
    .cardSwiper.swiper .swiper-pagination .swiper-pagination-bullet {
        width: 9px;
        height: 9px;
    }
}

.cardSwiper.swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--purple) !important;
}

.cardSwiper .card {
    background: var(--surface);
    border: 1.5px solid var(--border-color);
    border-radius: 16px;
    height: 120px;
    margin: 2px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

@media (max-width: 575.98px) {
    .cardSwiper .card {
        width: 100%;
        height: 120px;
    }
}

.cardSwiper .card .card-body {
    padding: 16px;
    display: flex;
    align-items: center;
    flex: 1;
    overflow: hidden;
    min-height: 0;
    position: relative;
}

.cardSwiper .card.card-journey {
    transition: all 0.5s ease-in-out;
}

    .cardSwiper .card.card-journey .card-body {
        overflow: hidden;
        gap: 12px;
    }

    .cardSwiper .card.card-journey a.card-title {
        color: var(--text-muted);
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        min-width: 0;
        flex: 1;
        overflow: hidden;
        word-wrap: break-word;
        line-height: 1.5;
        padding-inline-end: 24px;
        text-decoration: none;
    }

    .cardSwiper .card.card-journey a:not(.card-title) {
        color: var(--text-muted);
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .cardSwiper .card.card-journey img {
        transition: all 0.3s ease-in-out;
    }

    .cardSwiper .card.card-journey:hover {
        border: 1.5px solid rgba(98, 62, 90, 0.3);
    }

        .cardSwiper .card.card-journey:hover img {
            filter: invert(44%) sepia(33%) saturate(447%) hue-rotate(221deg) brightness(95%) contrast(90%);
        }

        .cardSwiper .card.card-journey:hover a,
        .cardSwiper .card.card-journey:hover .arrow-icon {
            color: var(--purple);
        }

        .cardSwiper .card.card-journey:hover .arrow-icon {
            inset-inline-end: 30px;
            opacity: 1;
        }

    .cardSwiper .card.card-journey .arrow-icon {
        position: absolute;
        inset-inline-end: 15px;
        opacity: 0;
        font-size: 20px;
        transition: all 0.25s cubic-bezier(0.31, -0.105, 0.43, 1.4);
        cursor: pointer;
    }

html[dir=rtl] .cardSwiper .card.card-journey .arrow-icon {
    transform: scaleX(-1);
}

.cardSwiper .card .icon-box {
    height: 100px;
    width: 100px;
    min-height: 100px;
    min-width: 100px;
    max-width: 100px;
    max-height: 100px;
    border-radius: 8px;
    padding: 10px;
    margin-inline-end: 12px;
    opacity: 1;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
}

@media (max-width: 575.98px) {
    .cardSwiper .card .icon-box {
        height: 80px;
        width: 80px;
        min-height: 80px;
        min-width: 80px;
        max-width: 80px;
        max-height: 80px;
    }
}

.cardSwiper .card .icon-box figure {
    margin: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cardSwiper .card .icon-box img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}

.imageSwiper.swiper {
    overflow-x: clip !important;
    overflow-y: visible !important;
}

    .imageSwiper.swiper .swiper-slide {
        margin-inline-end: 20px;
    }

        .imageSwiper.swiper .swiper-slide a {
            color: inherit;
        }

        .imageSwiper.swiper .swiper-slide figure img {
            border-radius: 16px;
            aspect-ratio: 524/300;
            object-fit: cover;
        }

        .imageSwiper.swiper .swiper-slide .fig-caption {
            padding-block: 1.5rem;
        }

            .imageSwiper.swiper .swiper-slide .fig-caption h2 {
                line-height: 31px;
                display: -webkit-box;
                -webkit-line-clamp: 1;
                -webkit-box-orient: vertical;
                overflow: hidden;
            }

            .imageSwiper.swiper .swiper-slide .fig-caption p {
                line-height: 25px;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                overflow: hidden;
            }

@media (max-width: 767.98px) {
    .imageSwiper.swiper .swiper-slide figure img {
        aspect-ratio: 2;
    }

    .imageSwiper.swiper .swiper-slide .fig-caption h2 {
        line-height: 28px;
    }
}

.imageSwiper.swiper .swiper-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px 18px;
    width: auto;
    height: 45px;
    background: rgba(174, 174, 174, 0.2);
    border-radius: 98px;
    inset-inline-start: unset;
    margin-bottom: -66px;
    position: absolute;
    inset-inline-start: 50%;
    transform: translateX(-50%);
}

@media (max-width: 1199.98px) {
    .imageSwiper.swiper .swiper-pagination {
        margin-bottom: -50px;
        position: absolute;
        bottom: 80px;
    }
}

@media (max-width: 768px) {
    .imageSwiper.swiper .swiper-pagination {
        height: 35px !important;
        padding: 5px 10px !important;
    }
}

html[dir=rtl] .imageSwiper.swiper .swiper-pagination {
    width: fit-content;
    inset-inline-start: unset;
    inset-inline-end: 50%;
    transform: translateX(-50%);
}

.imageSwiper.swiper .swiper-pagination .swiper-pagination-bullet {
    width: 14px;
    height: 14px;
    background: var(--surface) !important;
    opacity: 1;
}

    .imageSwiper.swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
        background: var(--purple) !important;
    }

.swiper-button-next,
.swiper-button-prev {
    position: absolute;
    top: -88px;
    gap: 8px;
    width: 54px;
    height: 54px;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 100%;
    font-size: 0;
    border: 1px solid var(--purple);
    z-index: 9;
}

    .swiper-button-next::after,
    .swiper-button-prev::after {
        font-family: bootstrap-icons !important;
        color: var(--purple);
        font-size: 1.25rem;
    }

    .swiper-button-next:hover,
    .swiper-button-prev:hover {
        background: var(--violet);
    }

        .swiper-button-next:hover::after,
        .swiper-button-prev:hover::after {
            color: var(--on-primary);
        }

@media (max-width: 575.98px) {
    .swiper-button-next,
    .swiper-button-prev {
        width: 40px;
        height: 40px;
    }
}

.swiper-button-next::after {
    content: "\f285" !important;
}

html[dir=rtl] .swiper-button-next {
    transform: scaleX(-1);
}

/* Position next logically (like prev) so the pair stays grouped and mirrors
   together in RTL, instead of next staying on the physical right. */
.swiper-button-next {
    inset-inline-start: unset !important;
    inset-inline-end: 10px !important;
}

.swiper-button-prev {
    inset-inline-start: unset !important;
    inset-inline-end: 80px !important;
}

html[dir=rtl] .swiper-button-prev {
    transform: scaleX(-1);
}

@media (max-width: 575.98px) {
    .swiper-button-prev {
        inset-inline-end: 60px;
    }
}

.swiper-button-prev::after {
    content: "\f284" !important;
}

.event-details {
    border-bottom: 1px solid var(--border);
    padding-block: 1.5rem;
}

    .event-details p {
        font-weight: 400;
        font-size: 14px !important;
        color: var(--text-muted);
        margin-bottom: 0;
    }

    .event-details i {
        font-size: 8px;
        color: var(--purple);
    }

    .event-details a {
        line-height: 28px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

@media (max-width: 767.98px) {
    .event-details a {
        font-size: 18px;
        line-height: 26px;
    }
}

.key-details {
    position: sticky;
    top: 0;
}

@media (min-width: 768px) {
    .key-details {
        top: -12%;
        margin-top: -10%;
    }
}

.key-details .card {
    border: 0;
}

.key-details .card-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 20px 40px;
    gap: 32px;
    height: 70px;
    background: rgba(229, 229, 230, 0.8);
    border-radius: 16px 16px 0px 0px !important;
    border: 0;
    position: sticky;
    top: 0;
    z-index: 9;
}

.key-details .card-body {
    border: 1px solid var(--border-color);
    border-top: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 40px 40px 48px;
    gap: 32px;
    height: 730px;
    border-radius: 0 0 16px 16px !important;
    z-index: 9;
    background-color: var(--surface);
}

.key-details .card-details-item {
    border-bottom: 1px solid var(--border-color);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    width: 100%;
    padding-bottom: 16px;
}

    .key-details .card-details-item figure img {
        border: 1px solid var(--border-color);
        border-radius: 12px;
    }

    .key-details .card-details-item iframe {
        width: 100%;
        height: 150px;
        border: 1px solid #E7E7E7;
        border-radius: 12px;
    }

.video-container {
    position: relative;
}

    .video-container video {
        border-radius: 16px;
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        controls: hidden;
    }

        .video-container video::-webkit-media-controls {
            display: none !important;
        }

.video-btn {
    position: absolute;
    width: 54px;
    height: 54px;
    background: rgba(0, 0, 0, 0.1);
    border-radius: 50%;
    bottom: 32px;
    left: 32px;
    border: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .video-btn::after {
        content: "";
        position: absolute;
        inset: 0;
        padding: 1px;
        border-radius: 50%;
        background: linear-gradient(221.22deg, rgba(255, 255, 255, 0) 36.55%, var(--surface) 142.1%);
        -webkit-mask: linear-gradient(var(--on-primary) 0 0) content-box, linear-gradient(var(--on-primary) 0 0);
        -webkit-mask-composite: xor;
        mask-composite: exclude;
    }

.accordion {
    background-color: var(--surface-2);
    border-radius: 16px;
    padding: 40px;
}

@media (max-width: 767.98px) {
    .accordion {
        padding: 20px;
    }
}

.accordion-button {
    font-style: normal;
    font-weight: 500;
    font-size: 20px !important;
    display: flex;
    align-items: center;
    background-color: transparent !important;
    color: var(--text) !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin-bottom: 12px;
}

    .accordion-button:focus {
        outline: none !important;
        box-shadow: none !important;
    }

@media (max-width: 767.98px) {
    .accordion-button {
        font-size: 16px !important;
        padding: 5px;
    }

        .accordion-button::after {
            width: 18px !important;
            height: 18px !important;
            inset-inline-end: 0 !important;
            font-size: 18px !important;
        }

        .accordion-button span {
            white-space: pre-line;
            margin-inline-end: 2rem;
        }
}

.accordion-button:not(.collapsed) {
    background-color: transparent;
    border: 0;
    box-shadow: none;
}

.accordion-button::after {
    transition: transform 0.15s ease-in-out;
    position: absolute;
    inset-inline-end: 0;
    padding: 15px !important;
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 100%;
    border: none !important;
    background-size: 0;
    content: "\f4fe" !important;
    font-family: bootstrap-icons !important;
    color: var(--text);
    font-weight: 500 !important;
    vertical-align: middle;
    justify-content: center;
    display: flex;
    align-items: center;
    background-image: none !important;
}

@media (min-width: 768px) {
    .accordion-button::after {
        width: 45px !important;
        height: 45px !important;
        font-size: 24px !important;
    }
}

.accordion-button:not(.collapsed)::after {
    transform: rotate(45deg) !important;
    transition: transform 0.15s ease-in-out;
}

.accordion-button:focus {
    box-shadow: none;
}

.accordion-item {
    border: 0 !important;
    border-radius: 0;
    padding-block: 12px;
    margin-bottom: 16px;
    border-radius: 16px;
    background-color: transparent !important;
}

@media (max-width: 767.98px) {
    .accordion-item {
        margin-bottom: 0 !important;
    }
}

.accordion-item:last-child {
    border-bottom: 0;
}

.accordion-body {
    font-weight: 400;
    font-size: 16px;
    color: var(--text-muted);
    padding-block: 5px;
    padding: 0 !important;
    max-width: 90%;
}

@media (max-width: 767.98px) {
    .accordion-body {
        font-size: 14px;
        padding: 5px;
    }
}

.sticky-row {
    position: sticky;
    top: 69px;
    background-color: var(--surface);
    z-index: 999;
    padding: 10px;
    transition: 0.3s all ease;
}

body:has(.scroll-up) ~ .sticky-row,
body:has(.scroll-up) .sticky-row {
    top: 125px;
    transition: 0.3s all ease;
}

@media (min-width: 1200px) {
    .documents-table .documents-table-scroll {
        overflow: unset !important;
        -webkit-overflow-scrolling: touch;
    }
}

@media (max-width: 767.98px) {
    .documents-table .documents-table-scroll table {
        min-width: 800px;
    }
}

@media (max-width: 767.98px) {
    .documents-table {
        overflow: visible;
        display: block;
        width: 100%;
        padding-block-end: 12px;
    }
}

.documents-table.table-responsive {
    overflow-x: unset !important;
}

@media (max-width: 767.98px) {
    .documents-table.table-responsive {
        scrollbar-width: thin;
        scrollbar-color: var(--violet) #EBEBEB;
        padding-block-end: 12px;
    }

        .documents-table.table-responsive::-webkit-scrollbar {
            height: 8px;
            display: block !important;
            -webkit-appearance: none;
            background-color: #EBEBEB;
        }

        .documents-table.table-responsive::-webkit-scrollbar-track {
            background: #EBEBEB;
            border-radius: 10px;
            -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.1);
        }

        .documents-table.table-responsive::-webkit-scrollbar-thumb {
            background: var(--violet);
            border-radius: 10px;
            -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
        }

            .documents-table.table-responsive::-webkit-scrollbar-thumb:hover {
                background: #240b3f;
            }

            .documents-table.table-responsive::-webkit-scrollbar-thumb:active {
                background: #18072a;
            }
}

.documents-table thead tr {
    background: var(--surface);
}

.documents-table thead th {
    font-size: 20px;
    font-weight: 600;
    border: none;
    padding: 0;
    color: var(--text-subtle);
}

@media (min-width: 1200px) {
    .documents-table thead th {
        position: sticky;
        top: 125px;
        padding-block: 20px;
        z-index: 100;
        background: var(--surface);
        box-shadow: 0 2px 0 0 var(--secondary), 0 2px 6px rgba(0, 0, 0, 0.06);
        transition: 0.3s all ease;
    }
}

@media (max-width: 991.98px) {
    .documents-table thead th {
        font-size: 18px;
    }
}

@media (max-width: 767.98px) {
    .documents-table thead th {
        font-size: 16px;
        padding-block: 0;
        padding-inline: 10px;
    }
}

.documents-table .section-row {
    padding-block: 20px;
    padding-inline: 0;
    font-weight: 500;
    color: var(--primary-accent);
    font-size: 20px;
    border-block-end: 1px solid var(--secondary);
    padding-block-start: 60px;
}

@media (max-width: 991.98px) {
    .documents-table .section-row {
        font-size: 18px;
        padding-block-start: 40px;
    }
}

@media (max-width: 767.98px) {
    .documents-table .section-row {
        font-size: 16px;
        padding-block: 15px;
        padding-inline: 10px;
        padding-block-start: 30px;
    }
}

.documents-table .file-name {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    line-height: 1.3;
}

@media (max-width: 767.98px) {
    .documents-table .file-name {
        gap: 8px;
    }
}

.documents-table .file-name p {
    text-align: start;
}

@media (max-width: 767.98px) {
    .documents-table .file-name p {
        font-size: 14px;
        line-height: 1.4;
    }
}

.documents-table .file-icon {
    width: 18px;
    height: 24px;
    background: url(../../assets/images/pdf-icon.svg) no-repeat center;
    flex-shrink: 0;
}

@media (max-width: 767.98px) {
    .documents-table .file-icon {
        width: 16px;
        height: 20px;
        background-size: contain;
    }
}

.documents-table td p {
    margin: 0;
    color: var(--text-muted);
    font-weight: 500;
    font-size: 20px;
    text-align: center;
}

@media (max-width: 991.98px) {
    .documents-table td p {
        font-size: 18px;
    }
}

@media (max-width: 767.98px) {
    .documents-table td p {
        font-size: 14px;
    }
}

.documents-table tbody td {
    border: none;
    padding-block-start: 20px;
    padding-block-end: 5px;
    vertical-align: middle;
    padding-inline: 0;
}

@media (max-width: 767.98px) {
    .documents-table tbody td {
        padding-block-start: 15px;
        padding-block-end: 10px;
        padding-inline: 10px;
    }
}

.documents-table .file-lang {
    display: flex;
    gap: 0px;
    justify-content: flex-end;
}

@media (max-width: 767.98px) {
    .documents-table .file-lang {
        justify-content: center;
        gap: 5px;
    }
}

.documents-table .file-lang a {
    font-weight: 500;
    font-size: 16px;
    color: var(--primary-accent);
    width: 70px;
    height: 50px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
}

@media (max-width: 767.98px) {
    .documents-table .file-lang a {
        font-size: 14px;
        width: 50px;
        height: 40px;
    }
}

.documents-table .file-lang a:hover {
    background-color: var(--violet);
    color: var(--on-primary);
}

.documents-table .content-row td {
    position: relative;
}

    .documents-table .content-row td:first-child {
        width: 62%;
    }

@media (max-width: 767.98px) {
    .documents-table .content-row td:first-child {
        width: auto;
        min-width: 200px;
    }
}

.documents-table .content-row td:not(:last-child)::after {
    content: "";
    position: absolute;
    inset-inline-end: 0;
    inset-block-start: 50%;
    transform: translateY(-50%);
    height: 54px;
    width: 1px;
    background-color: #EBEBEB;
    margin-block-start: 8px;
}

@media (max-width: 767.98px) {
    .documents-table .content-row td:not(:last-child)::after {
        height: 40px;
    }
}

body:has(.scroll-up) ~ .documents-table table thead th,
body:has(.scroll-up) .documents-table table thead th {
    top: 180px;
    transition: 0.3s all ease;
}

.panel-holder .overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease;
    z-index: 998;
}

    .panel-holder .overlay.active {
        opacity: 1;
        visibility: visible;
    }

.panel-holder .side-panel {
    position: fixed;
    inset-block-start: 0;
    inset-inline-end: 0;
    width: 45%;
    max-width: 820px;
    height: 100vh;
    background: var(--surface);
    transform: translateX(100%);
    transition: transform 0.4s ease;
    z-index: 999;
    padding: 24px;
}

@media (max-width: 991.98px) {
    .panel-holder .side-panel {
        width: 60%;
        padding: 20px;
    }
}

@media (max-width: 767.98px) {
    .panel-holder .side-panel {
        width: 100%;
        max-width: 100%;
        padding: 16px;
    }
}

.panel-holder .side-panel.active {
    transform: translateX(0);
}

.panel-holder .close-panel {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    border: 1px solid var(--secondary);
    background: var(--surface);
    cursor: pointer;
    color: var(--primary-accent);
    font-size: 20px;
    flex-shrink: 0;
}

@media (max-width: 767.98px) {
    .panel-holder .close-panel {
        width: 44px;
        height: 44px;
        font-size: 18px;
    }
}

.panel-holder .side-panel-content {
    height: 100%;
}

@media (max-width: 767.98px) {
    .panel-holder .side-panel-content {
        height: calc(100% - 60px);
    }
}

.panel-holder .side-panel-content iframe {
    width: 100%;
    height: calc(100% - 50px);
    border: none;
}

@media (max-width: 767.98px) {
    .panel-holder .side-panel-content iframe {
        height: calc(100% - 40px);
    }
}

.panel-holder .side-panel-head {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-block-end: 30px;
}

@media (max-width: 767.98px) {
    .panel-holder .side-panel-head {
        gap: 12px;
        margin-block-end: 20px;
    }
}

.panel-holder .side-panel-head h3 {
    font-size: 20px;
    font-weight: 500;
    color: var(--text-muted);
    margin: 0;
}

@media (max-width: 991.98px) {
    .panel-holder .side-panel-head h3 {
        font-size: 18px;
    }
}

@media (max-width: 767.98px) {
    .panel-holder .side-panel-head h3 {
        font-size: 16px;
        line-height: 1.4;
    }
}

.filter-taxation .filter-tabs {
    justify-content: flex-end;
    margin-block-end: 40px;
}

@media (max-width: 991.98px) {
    .filter-taxation .filter-tabs {
        margin-block-end: 30px;
    }
}

@media (max-width: 767.98px) {
    .filter-taxation .filter-tabs {
        justify-content: flex-start;
        flex-direction: column;
        gap: 15px;
        margin-block-end: 20px;
    }
}

@media (max-width: 767.98px) {
    .media-centre-tabs .tab-content {
        padding-block: 20px;
        padding-inline: 0;
    }
}

@media (max-width: 767.98px) {
    .media-centre-tabs .tab-content .tab-pane .row.mb-5.mt-5 {
        margin-block-start: 20px !important;
        margin-block-end: 20px !important;
    }
}

@media (max-width: 767.98px) {
    .media-centre-tabs .tab-content .tab-pane .row .col-lg h3 {
        margin-block-end: 15px;
    }
}

@media (max-width: 767.98px) {
    .media-centre-tabs .tab-content .tab-pane .row .col-lg-auto {
        width: 100%;
    }
}

@media (max-width: 767.98px) {
    .media-centre-tabs .tab-content .tab-pane .row.mt-1 {
        margin-block-start: 20px !important;
        flex-direction: column;
        gap: 15px;
    }
}

@media (max-width: 767.98px) {
    .media-centre-tabs .tab-content .tab-pane .row.mt-1 .col-lg {
        width: 100%;
    }
}

@media (max-width: 767.98px) {
    .media-centre-tabs .tab-content .tab-pane .row.mt-1 .col-lg h5 {
        margin-block-end: 0;
    }
}

@media (max-width: 767.98px) {
    .media-centre-tabs .tab-content .tab-pane .row.mt-1 .col-lg-auto {
        width: 100%;
    }
}

@media (max-width: 991.98px) {
    .section-title {
        margin-block-end: 30px !important;
    }
}

@media (max-width: 767.98px) {
    .section-title {
        margin-block-end: 20px !important;
        padding-block: 0;
        padding-inline: 15px;
    }
}

.taxation-comp {
}

    .taxation-comp figure {
        width: 100%;
        margin: 0;
    }

    .taxation-comp figure,
    .taxation-comp video.fig-media,
    .taxation-comp .ratio-16x9 {
        width: 100%;
        aspect-ratio: 16/9;
        overflow: hidden;
        border-radius: 12px;
        display: block;
    }

        .taxation-comp figure img {
            width: 100%;
            aspect-ratio: 16/9;
            object-fit: cover;
            border-radius: inherit;
            display: block;
        }

    .taxation-comp video.fig-media {
        width: 100%;
        aspect-ratio: 16/9;
        object-fit: cover;
        border-radius: inherit;
    }

        .taxation-comp video.fig-media::-webkit-media-controls {
            opacity: 1;
        }

    .taxation-comp .ratio-16x9 iframe {
        width: 100%;
        height: 100%;
        border: 0;
        border-radius: inherit;
        display: block;
    }

body:has(.taxation-table-section) .ui-datepicker {
    z-index: 100 !important;
}

.taxation-table-section {
    --tax-nav-height: 0px;
    --tax-sticky-height: 0px;
}

    .taxation-table-section .sticky-header {
        position: sticky;
        top: var(--tax-nav-height);
        z-index: 100;
        background-color: var(--surface);
        padding-block: 20px;
        transition: top 0.3s ease;
    }

    .taxation-table-section .section-heading h2 {
        line-height: 1.2;
    }

    .taxation-table-section .filer-box {
        gap: 10px;
        flex-wrap: wrap;
    }

        .taxation-table-section .filer-box .filter-tabs {
            margin: 0;
            justify-content: flex-end;
            gap: 8px;
            flex-wrap: wrap;
        }

    .taxation-table-section .btn-go {
        background-color: var(--violet);
        color: var(--on-primary);
        border-radius: 50px;
        padding: 10px 24px;
        font-size: 16px;
        font-weight: 500;
        text-decoration: none;
        white-space: nowrap;
        display: inline-flex;
        align-items: center;
        line-height: 1;
        min-height: 54px;
    }

@media (max-width: 575.98px) {
    .taxation-table-section .btn-go {
        min-height: 42px;
    }
}

.taxation-table-section .btn-go:hover {
    background-color: #240b3f;
    color: var(--on-primary);
}

.taxation-table-section .btn-reset {
    color: var(--primary-accent);
    font-size: 16px;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
}

    .taxation-table-section .btn-reset:hover {
        text-decoration: underline;
    }

.taxation-table-section .table-meta-row {
    padding-block: 10px;
    background-color: var(--surface);
}

    .taxation-table-section .table-meta-row .item-per-page-box p {
        color: var(--text-subtle);
        white-space: nowrap;
        margin: 0;
    }

    .taxation-table-section .table-meta-row .item-per-page-box .filter-tabs {
        margin: 0;
    }

        .taxation-table-section .table-meta-row .item-per-page-box .filter-tabs .filter-items {
            min-width: 80px;
        }

.taxation-table-section .table-thead-mirror {
    display: none;
}

@media (max-width: 767.98px) {
    .taxation-table-section .table-thead-mirror {
        display: block;
        overflow-x: hidden;
    }

        .taxation-table-section .table-thead-mirror table {
            table-layout: fixed;
            min-width: 600px;
            margin: 0;
            border-collapse: collapse;
        }

            .taxation-table-section .table-thead-mirror table thead tr {
                background-color: var(--surface-2);
            }

            .taxation-table-section .table-thead-mirror table th {
                position: static;
                background-color: var(--surface-2);
                letter-spacing: 0.06em;
                padding-block: 16px;
                padding-inline: 16px;
                border: none;
                box-shadow: 0 1px 0 0 var(--secondary);
            }
}

@media (max-width: 767.98px) {
    .taxation-table-section .sticky-header {
        padding-block-end: 0;
    }
}

.taxation-table-section .table-responsive {
    overflow-x: unset;
}

@media (max-width: 767.98px) {
    .taxation-table-section .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

@media (max-width: 767.98px) {
    .taxation-table-section .table-responsive table thead th {
        display: none;
    }
}

.taxation-table-section table thead tr {
    background-color: var(--surface-2);
}

.taxation-table-section table thead th {
    position: sticky;
    top: calc(var(--tax-nav-height) + var(--tax-sticky-height));
    z-index: 99;
    background-color: var(--surface-2);
    letter-spacing: 0.06em;
    padding-block: 16px;
    padding-inline: 16px;
    border: none;
    transition: top 0.3s ease;
    box-shadow: 0 1px 0 0 var(--secondary);
}

    .taxation-table-section table thead th:nth-child(1) {
        width: 40%;
    }

    .taxation-table-section table thead th:nth-child(2) {
        width: 15%;
    }

    .taxation-table-section table thead th:nth-child(3) {
        width: 15%;
    }

    .taxation-table-section table thead th:nth-child(4) {
        width: 30%;
        text-align: center;
    }

@media (max-width: 767.98px) {
    .taxation-table-section table {
        table-layout: fixed;
        min-width: 600px;
        border-collapse: collapse;
    }

        .taxation-table-section table td:nth-child(1) {
            width: 70%;
        }

        .taxation-table-section table td:nth-child(2) {
            width: 15%;
        }

        .taxation-table-section table td:nth-child(3) {
            width: 15%;
        }

        .taxation-table-section table td:nth-child(4) {
            width: 25%;
        }
}

.taxation-table-section table tbody td {
    padding-block: 18px;
    padding-inline: 16px;
    vertical-align: middle;
    border: none;
    border-bottom: 1px solid #EBEBEB;
}

    .taxation-table-section table tbody td p {
        margin: 0;
        font-weight: 500;
        color: var(--text-subtle);
        text-align: start;
    }

@media (max-width: 767.98px) {
    .taxation-table-section table tbody td p {
        white-space: nowrap;
    }
}

.taxation-table-section table .content-row:hover {
    background-color: rgba(244, 244, 244, 0.6);
}

.taxation-table-section .file-name {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

    .taxation-table-section .file-name p {
        font-weight: 500;
        color: var(--text-muted);
        margin: 0;
        text-align: start;
        display: flex;
        align-items: center;
        justify-content: start;
        gap: 1rem;
    }

        .taxation-table-section .file-name p .badge-new {
            display: inline-flex;
            align-items: center;
            font-size: 12px;
            font-weight: 400;
            color: #414651;
            background: var(--surface-2);
            padding: 2px 8px;
            border-radius: 50px;
            white-space: nowrap;
            flex-shrink: 0;
            line-height: 1.4;
            width: fit-content;
        }

@media (max-width: 767.98px) {
    .taxation-table-section .file-name p {
        display: -webkit-box;
        -webkit-line-clamp: auto;
        -webkit-box-orient: vertical;
        overflow: hidden;
        white-space: wrap;
    }
}

.taxation-table-section .file-tags {
    display: flex;
    align-items: center;
    gap: 0;
}

    .taxation-table-section .file-tags .tag {
        font-size: 13px;
        color: var(--text-muted);
        font-weight: 400;
    }

        .taxation-table-section .file-tags .tag:not(:last-child)::after {
            content: " •";
            padding-inline-end: 6px;
        }

.taxation-table-section .status-badge {
    display: inline-block;
    padding: 5px 14px;
    border-radius: 20px;
    font-size: 18px;
    font-size: clamp(12px, 12px + 0vw, 12px);
    font-weight: 500;
    white-space: nowrap;
}

@media (min-width: 768px) {
    .taxation-table-section .status-badge {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .taxation-table-section .status-badge {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

.taxation-table-section .status-badge.effective {
    background-color: var(--surface-3);
    color: var(--success);
}

.taxation-table-section .status-badge.on-hold {
    background-color: var(--surface-3);
    color: #884f05;
}

.taxation-table-section .status-badge.expired {
    background-color: var(--surface-3);
    color: #e02424;
}

.taxation-table-section .file-box {
    display: flex;
    align-items: center;
    gap: 25px;
    width: fit-content;
}

    .taxation-table-section .file-box .download-link {
        flex: 1;
        min-width: max-content;
    }

.taxation-table-section .download-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    color: var(--primary-accent);
    font-weight: 600;
    font-size: 14px;
    white-space: nowrap;
}

    .taxation-table-section .download-link a {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        color: inherit;
        text-decoration: none;
    }

    .taxation-table-section .download-link i {
        font-size: 20px;
    }

    .taxation-table-section .download-link .file-info {
        color: var(--text-subtle);
        font-weight: 400;
        font-size: 12px;
    }

    .taxation-table-section .download-link:hover a {
        color: #240b3f;
    }


.taxation-table-section .filter-toggle-btn {
    display: none;
}

@media (max-width: 991.98px) {
    .taxation-table-section .filter-toggle-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        background-color: var(--violet);
        color: var(--on-primary);
        border: none;
        border-radius: 8px;
        font-size: 20px;
        cursor: pointer;
        flex-shrink: 0;
        transition: background-color 0.2s ease;
    }

        .taxation-table-section .filter-toggle-btn:hover, .taxation-table-section .filter-toggle-btn.active {
            background-color: #240b3f;
        }
}

@media (max-width: 991.98px) {
    .taxation-table-section .filer-box {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.35s ease;
        flex-wrap: wrap !important;
        justify-content: flex-start !important;
        width: 100%;
        padding-block-start: 0;
        transition: max-height 0.35s ease, padding-block-start 0.35s ease;
    }

        .taxation-table-section .filer-box.open {
            max-height: 500px;
            padding-block-start: 12px;
        }

        .taxation-table-section .filer-box .filter-tabs {
            justify-content: flex-start;
            flex-wrap: wrap;
        }

        .taxation-table-section .filer-box .btn-go,
        .taxation-table-section .filer-box .btn-reset {
            margin-block-start: 4px;
        }
}

body:has(.scroll-up) .taxation-table-section {
    --tax-nav-height: 125px;
}

@media (max-width: 991.98px) {
    body:has(.scroll-up) .taxation-table-section {
        --tax-nav-height: 66px;
    }
}

.resource-center-section {
}

    .resource-center-section .resource-center-navs {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        margin-bottom: 2rem;
    }

        .resource-center-section .resource-center-navs::-webkit-scrollbar {
            display: none;
        }

        .resource-center-section .resource-center-navs .nav-pills {
            flex-wrap: nowrap;
            gap: 0;
            min-width: max-content;
            justify-content: center;
            gap: 2rem;
        }

        .resource-center-section .resource-center-navs .nav-link {
            border-radius: 0 !important;
            background: transparent !important;
            color: var(--text-subtle) !important;
            padding: 4px 0px;
            border-bottom: 2px solid transparent;
            white-space: nowrap;
            transition: color 0.2s, border-color 0.2s;
        }

@media (max-width: 991.98px) {
    .resource-center-section .resource-center-navs .nav-link {
        font-size: 14px;
        padding: 12px 16px;
    }
}

.resource-center-section .resource-center-navs .nav-link:hover {
    color: var(--primary-accent) !important;
}

.resource-center-section .resource-center-navs .nav-link.active {
    color: var(--primary-accent) !important;
    background: transparent !important;
    border-bottom-color: var(--violet);
}

.resource-center-section .resource-center-tabs .tab-pane {
    outline: none;
}

.resource-center-section .heading-box {
    position: sticky;
    top: 0px;
    z-index: 7;
    background: var(--surface);
    padding-block-start: 1.5rem;
    transition: top 0.3s ease;
}

@media (max-width: 767.98px) {
    .resource-center-section .heading-box {
        padding-block-start: 18px;
    }
}

.resource-center-section .hb-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-block-end: 14px;
    flex-wrap: wrap;
}

@media (max-width: 767.98px) {
    .resource-center-section .hb-top {
        gap: 12px;
        margin-block-end: 10px;
    }
}

.resource-center-section .hb-heading h2 {
    color: var(--primary-accent);
    margin: 0;
    line-height: 1.15;
    flex-shrink: 0;
}

.resource-center-section .hb-filters .filter-tabs {
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
}

@media (max-width: 991.98px) {
    .resource-center-section .hb-filters .filter-tabs {
        justify-content: flex-start;
    }
}

.resource-center-section .showing-documents {
    color: var(--text);
    margin-block-end: 1.5rem;
}

    .resource-center-section .showing-documents strong {
        font-weight: 700;
        margin-inline-start: 5px;
    }

.resource-center-section .table-header {
    display: flex;
    align-items: center;
    background: #f3f4f6;
    padding-block: 13px;
}

    .resource-center-section .table-header p {
        margin: 0;
        color: var(--text);
    }

        .resource-center-section .table-header p:nth-child(1) {
            flex: 1;
            min-width: 0;
            padding-inline-start: 1.5rem;
        }

        .resource-center-section .table-header p:nth-child(2) {
            width: 130px;
            flex-shrink: 0;
            text-align: start;
        }

        .resource-center-section .table-header p:nth-child(3) {
            width: 340px;
            flex-shrink: 0;
            text-align: start;
        }

@media (max-width: 991.98px) {
    .resource-center-section .table-header p:nth-child(2) {
        width: 100px;
    }

    .resource-center-section .table-header p:nth-child(3) {
        width: 260px;
    }
}

@media (max-width: 767.98px) {
    .resource-center-section .table-header {
        display: none;
    }
}

.resource-center-section .resource-center-tabs-content-main {
    padding-block-end: 60px;
    margin-top: 1.5rem;
}

.resource-center-section .rc-collapse-btn {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 12px;
    background: transparent;
    border: none;
    outline: none;
    padding: 1.5rem;
    cursor: pointer;
    text-align: start;
    appearance: none;
    border-bottom: 1px solid var(--text-subtle);
}

@media (max-width: 767.98px) {
    .resource-center-section .rc-collapse-btn {
        padding-block: 15px;
        gap: 8px;
    }
}

.resource-center-section .rc-collapse-btn .rc-collapse-title {
    color: var(--primary-accent);
    letter-spacing: 0.03em;
}

@media (max-width: 991.98px) {
    .resource-center-section .rc-collapse-btn .rc-collapse-title {
        font-size: 16px;
    }
}

@media (max-width: 767.98px) {
    .resource-center-section .rc-collapse-btn .rc-collapse-title {
        font-size: 14px;
    }
}

.resource-center-section .rc-collapse-btn .rc-collapse-count {
    font-size: 12px;
    font-weight: 500;
    color: #414651;
    background: var(--surface-2);
    padding: 4px 12px;
    border-radius: 50px;
    white-space: nowrap;
    flex-shrink: 0;
}

.resource-center-section .rc-collapse-btn .bi-chevron-down {
    margin-inline-start: auto;
    font-size: 16px;
    color: var(--text-subtle);
    flex-shrink: 0;
    transition: transform 0.3s ease;
}

.resource-center-section .rc-collapse-btn[aria-expanded=false] .bi-chevron-down {
    transform: rotate(-90deg);
}

.resource-center-section .collapse-inner {
    padding-block-end: 4px;
    margin-top: 1.5rem;
    padding-inline-start: 1.5rem;
    position: relative;
}

    .resource-center-section .collapse-inner::before {
        content: "";
        position: absolute;
        top: 8px;
        inset-inline-start: 0;
        width: 1rem;
        height: calc(100% - 50px);
        border-inline-start: 2px solid var(--surface-3);
        border-top: 2px solid var(--surface-3);
        border-top-left-radius: 8px;
    }

    .resource-center-section .collapse-inner::after {
        content: "";
        position: absolute;
        bottom: 40px;
        inset-inline-start: -3px;
        width: 8px;
        height: 8px;
        border-radius: 50rem;
        background-color: var(--surface-3);
    }

    .resource-center-section .collapse-inner.without-timeline::before {
        display: none !important;
    }

    .resource-center-section .collapse-inner.without-timeline::after {
        display: none !important;
    }

    .resource-center-section .collapse-inner.without-timeline .rc-sub-title::before {
        display: none !important;
    }

    .resource-center-section .collapse-inner.without-date .date-box {
        visibility: hidden;
    }

@media (max-width: 767.98px) {
    .resource-center-section .collapse-inner.without-date .date-box {
        display: none;
    }
}

.resource-center-section .collapse-inner.without-date .download-box {
    justify-content: end;
    margin-inline-end: 1.4rem;
}

@media (max-width: 767.98px) {
    .resource-center-section .collapse-inner.without-date .download-box {
        justify-content: start;
        padding: 0;
    }
}

.resource-center-section .rc-sub-title {
    color: var(--primary-accent);
    padding-block-end: 1.5rem;
    margin-bottom: 0;
    position: relative;
}

    .resource-center-section .rc-sub-title::before {
        content: "";
        position: absolute;
        top: 4.5px;
        inset-inline-start: -15px;
        width: 8px;
        height: 8px;
        border-radius: 50rem;
        background-color: var(--surface-3);
    }

.resource-center-section .resource-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .resource-center-section .resource-list > li {
        border-bottom: 1px solid #EBEBEB;
    }

        .resource-center-section .resource-list > li:last-child {
            border-bottom: none;
        }

.resource-center-section .inner-items {
    display: flex;
    align-items: center;
    padding-block: 18px;
}

@media (max-width: 767.98px) {
    .resource-center-section .inner-items {
        flex-wrap: wrap;
        padding-block: 14px;
        gap: 6px;
    }
}

.resource-center-section .file-name-box {
    flex: 1;
    min-width: 0;
    padding-inline-end: 20px;
}

@media (max-width: 767.98px) {
    .resource-center-section .file-name-box {
        flex-basis: 100%;
        padding-inline-end: 0;
    }
}

.resource-center-section .fn-title {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-block-end: 5px;
}

    .resource-center-section .fn-title p {
        margin: 0;
        color: var(--text);
        line-height: 1.4;
    }

.resource-center-section .badge-new {
    display: inline-flex;
    align-items: center;
    font-size: 12px;
    font-weight: 400;
    color: #414651;
    background: var(--surface-2);
    padding: 2px 8px;
    border-radius: 50px;
    white-space: nowrap;
    flex-shrink: 0;
    line-height: 1.4;
}

.resource-center-section .file-tags {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 0;
}

    .resource-center-section .file-tags li {
        color: var(--text-subtle);
    }

        .resource-center-section .file-tags li:not(:last-child)::after {
            content: " •";
            padding-inline-end: 4px;
        }

.resource-center-section .date-box {
    width: 130px;
    flex-shrink: 0;
    text-align: start;
}

    .resource-center-section .date-box p {
        margin: 0;
        color: var(--text-subtle);
    }

@media (max-width: 991.98px) {
    .resource-center-section .date-box {
        width: 100px;
    }
}

@media (max-width: 767.98px) {
    .resource-center-section .date-box {
        width: auto;
        flex-shrink: 0;
        text-align: start;
        order: -1;
    }

        .resource-center-section .date-box p::before {
            content: "Date: ";
            font-weight: 600;
            color: var(--text-muted);
        }
}

.resource-center-section .download-box {
    width: 460px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
    justify-content: flex-start;
    padding-inline-start: 10px;
}

@media (max-width: 991.98px) {
    .resource-center-section .download-box {
        width: 360px;
    }
}

@media (max-width: 767.98px) {
    .resource-center-section .download-box {
        width: 100%;
        flex-basis: 100%;
        padding-inline-start: 0;
        gap: 4px;
    }
}

.resource-center-section .download-btn {
    position: static;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    color: var(--primary-accent);
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    white-space: normal;
    background: transparent;
    border: none;
    transition: background-color 0.15s, color 0.15s;
    cursor: pointer;
}

    .resource-center-section .download-btn i,
    .resource-center-section .download-btn img {
        font-size: 16px;
        flex-shrink: 0;
    }

    .resource-center-section .download-btn .dl-label {
        color: var(--primary-accent);
        min-width: 0;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .resource-center-section .download-btn .dl-meta {
        font-size: 12px;
        font-weight: 400;
        color: var(--text-subtle);
    }

    .resource-center-section .download-btn.rc-portal-btn .dl-label {
        color: var(--primary-accent);
    }

    .resource-center-section .download-btn.rc-portal-btn i {
        color: var(--primary-accent);
    }

body:has(.is-scrolled.is-hidden) .resource-center-section .heading-box {
    top: 0px;
}

@media (max-width: 991.98px) {
    body:has(.is-scrolled.is-hidden) .resource-center-section .heading-box {
        top: 0px;
    }
}

body:has(.is-scrolled) .resource-center-section .heading-box {
    top: 125px;
}

@media (max-width: 991.98px) {
    body:has(.is-scrolled) .resource-center-section .heading-box {
        top: 66px;
    }
}

.pdf-container {
    max-height: 80vh;
    overflow-y: auto;
    overflow-x: hidden;
    text-align: center;
}

.zoom-container {
    overflow: auto;
    touch-action: pan-x pan-y pinch-zoom;
    -webkit-overflow-scrolling: touch;
}

.pdf-container canvas {
    display: block;
    width: 100%;
    height: auto;
    max-width: 900px;
    margin: 0 auto 20px;
}

.ng-activities-section .section-heading {
    margin-bottom: 48px;
}

.ng-activities-section .ng-activities-nav {
    position: sticky;
    top: 50px;
    align-self: flex-start;
    transition: 0.3s all ease;
}

@media (max-width: 767.98px) {
    .ng-activities-section .ng-activities-nav {
        position: static;
        margin-bottom: 30px;
    }
}

.ng-activities-section .ng-activities-nav .nav-link {
    position: relative;
    border: 1px solid var(--border);
    background-color: var(--surface);
    border-radius: 16px;
    padding: 24px 16px 24px 24px;
    padding-inline: clamp(14px, 14px + 0vw, 14px);
    padding-block-start: clamp(14px, 14px + 0vw, 14px);
    padding-block-end: clamp(10px, 10px + 0vw, 10px);
    text-align: start;
    font-size: 24px;
    font-size: clamp(14px, 14px + 0vw, 14px);
    font-weight: 500;
    color: var(--text-subtle);
    margin-bottom: 24px;
}

@media (min-width: 768px) {
    .ng-activities-section .ng-activities-nav .nav-link {
        padding-inline: clamp(14px, 14px + 0vw, 14px);
    }
}

@media (min-width: 1200px) {
    .ng-activities-section .ng-activities-nav .nav-link {
        padding-inline: clamp(14px, -2.6666666667px + 1.3888888889vw, 24px);
    }
}

@media (min-width: 768px) {
    .ng-activities-section .ng-activities-nav .nav-link {
        padding-block-start: clamp(14px, 14px + 0vw, 14px);
    }
}

@media (min-width: 1200px) {
    .ng-activities-section .ng-activities-nav .nav-link {
        padding-block-start: clamp(14px, -2.6666666667px + 1.3888888889vw, 24px);
    }
}

@media (min-width: 768px) {
    .ng-activities-section .ng-activities-nav .nav-link {
        padding-block-end: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .ng-activities-section .ng-activities-nav .nav-link {
        padding-block-end: clamp(10px, 0px + 0.8333333333vw, 16px);
    }
}

@media (min-width: 768px) {
    .ng-activities-section .ng-activities-nav .nav-link {
        font-size: clamp(14px, 14px + 0vw, 14px);
    }
}

@media (min-width: 1200px) {
    .ng-activities-section .ng-activities-nav .nav-link {
        font-size: clamp(14px, -2.6666666667px + 1.3888888889vw, 24px);
    }
}

@media (max-width: 991.98px) {
    .ng-activities-section .ng-activities-nav .nav-link {
        margin-bottom: 0.5rem;
        border-radius: 0.5rem;
    }
}

.ng-activities-section .ng-activities-nav .nav-link ul {
    display: none;
    list-style: none;
    padding: 0;
    margin: 8px 0 0 16px;
}

    .ng-activities-section .ng-activities-nav .nav-link ul li a {
        display: block;
        padding: 5px 0;
        text-decoration: none;
        color: var(--bs-gray-dark, #343A40);
    }

        .ng-activities-section .ng-activities-nav .nav-link ul li a:hover {
            opacity: 1;
            color: var(--primary-accent);
        }

        .ng-activities-section .ng-activities-nav .nav-link ul li a.active {
            opacity: 1;
            color: var(--primary-accent);
        }

.ng-activities-section .ng-activities-nav .nav-link::after {
    content: "";
    position: absolute;
    top: 0;
    inset-inline-end: 0;
    width: 46px;
    height: 100%;
    background-image: url("../images/icons/arrow-down.svg");
    background-repeat: no-repeat;
    background-position: center center;
    filter: grayscale(1);
    opacity: 0.2;
    transform: rotate(-90deg);
}

.ng-activities-section .ng-activities-nav .nav-link:hover {
    background-color: var(--surface-3);
    border: 1px solid var(--border);
    color: var(--primary-accent);
}

.ng-activities-section .ng-activities-nav .nav-link.active {
    background-color: var(--surface-3);
    border: 1px solid var(--border);
    color: var(--primary-accent);
}

    .ng-activities-section .ng-activities-nav .nav-link.active ul {
        display: block;
    }

    .ng-activities-section .ng-activities-nav .nav-link.active:hover {
        color: var(--primary-accent);
    }

    .ng-activities-section .ng-activities-nav .nav-link.active::after {
        height: 68px;
        filter: grayscale(0);
        opacity: 1;
        transform: rotate(0deg);
    }

    .ng-activities-section .ng-activities-nav .nav-link.active.is-collapsed ul {
        display: none;
    }

    .ng-activities-section .ng-activities-nav .nav-link.active.is-collapsed::after {
        height: 100%;
        transform: rotate(-90deg);
    }

/* RTL: the closed nav-link arrow points toward the inline-end (left in Arabic), so flip it. */
html[dir=rtl] .ng-activities-section .ng-activities-nav .nav-link:not(.active)::after,
html[dir=rtl] .ng-activities-section .ng-activities-nav .nav-link.active.is-collapsed::after {
    transform: rotate(90deg);
}

@media (max-width: 1199.98px) {
    .ng-activities-section .ng-activities-nav .nav-link.active::after {
        height: 50px;
    }
}

.ng-activities-section .ng-activities-tabs .tab-content .main-heading {
    position: sticky;
    top: 50px;
    align-self: flex-start;
    z-index: 5;
    background-color: var(--surface);
    padding-bottom: 24px;
    transition: top 0.3s ease;
}

    .ng-activities-section .ng-activities-tabs .tab-content .main-heading::before {
        content: "";
        position: absolute;
        top: -50px;
        inset-inline-start: 0;
        background-color: var(--surface);
        width: 100%;
        height: 50px;
    }

@media (max-width: 767.98px) {
    .ng-activities-section .ng-activities-tabs .tab-content .main-heading::before {
        display: none;
    }
}

.ng-activities-section .ng-activities-tabs .tab-content .main-heading h4 {
    margin-bottom: 1rem;
}

.ng-activities-section .ng-activities-tabs .tab-content .main-heading p {
    margin-bottom: 1rem;
}

.ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box {
    background-color: var(--surface);
    border: 1px solid var(--surface-3);
    padding: 24px;
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 24px;
}

.ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner {
    display: flex;
    align-items: start;
    justify-content: start;
    gap: 16px;
}

@media (max-width: 767.98px) {
    .ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner {
        flex-direction: column;
    }
}

@media (max-width: 767.98px) {
    .ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .tag-box {
        min-width: 130px;
    }
}

.ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .tag-box .tag {
    width: fit-content;
    padding: 6px 16px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0;
    background-color: var(--surface-3);
    border-radius: 50rem;
}

@media (max-width: 767.98px) {
    .ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .tag-box .tag {
        width: 100%;
    }
}

.ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content {
    width: 100%;
}

    .ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .heading-box h5 {
        margin-bottom: 8px;
    }

    .ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .heading-box p {
        margin-bottom: 40px;
    }

@media (max-width: 767.98px) {
    .ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .heading-box p {
        margin-bottom: 20px;
    }
}

.ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .list-box.with-title {
    border-top: 2px solid var(--surface-3);
    border-inline-start: 2px solid var(--surface-3);
    padding-inline-start: 32px;
    padding-block-start: 30px;
    margin-block-start: 50px;
    position: relative;
    inset-inline-start: -32px;
    border-top-left-radius: 16px;
}

@media (max-width: 767.98px) {
    .ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .list-box.with-title {
        inset-inline-start: 0;
    }
}

html[dir=rtl] .ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .list-box.with-title {
    border-top-left-radius: 0;
    border-top-right-radius: 16px;
}

.ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .list-box.with-title::before {
    content: "";
    position: absolute;
    bottom: 0;
    inset-inline-start: -10px;
    width: 20px;
    height: 30px;
    background-color: var(--surface);
}

.ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .list-box.with-title::after {
    content: "";
    position: absolute;
    bottom: 30px;
    inset-inline-start: -6px;
    width: 10px;
    height: 10px;
    border-radius: 50rem;
    background-color: var(--surface-3);
}

.ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .list-box.with-title .title-box {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 1rem;
    position: absolute;
    top: 0;
    inset-inline-start: 30px;
    transform: translate(0%, -50%);
    background-color: var(--surface);
    width: 100%;
}

.ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .list-box .list-item {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 40px;
    padding-block: 20px;
    border-bottom: 1px solid var(--secondary);
}

@media (max-width: 767.98px) {
    .ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .list-box .list-item {
        gap: 20px;
        width: 100%;
    }
}

.ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .list-box .list-item:last-of-type {
    border-bottom: 0;
}

.ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .list-box .list-item .list-title {
    margin-bottom: 0;
    white-space: nowrap;
}

.ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .list-box .list-item .list-desc {
    margin-bottom: 0;
}

.ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .shipping-agent-box {
    margin-top: 40px;
    position: relative;
    border: 1px solid var(--secondary);
    border-radius: 12px;
    padding-top: 10px;
    padding-inline: 24px;
}

    .ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .shipping-agent-box .title {
        background-color: var(--surface-3);
        border-radius: 50rem;
        padding: 4px 16px;
        position: absolute;
        top: 0;
        inset-inline-start: 20px;
        transform: translate(0%, -50%);
    }

    .ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .shipping-agent-box .shipping-agent-list-item {
        padding-block: 24px;
        border-bottom: 1px solid var(--secondary);
    }

        .ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .shipping-agent-box .shipping-agent-list-item:last-of-type {
            border-bottom: 0;
        }

        .ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .shipping-agent-box .shipping-agent-list-item .list-title {
            margin-bottom: 8px;
        }

        .ng-activities-section .ng-activities-tabs .tab-content .ng-detail-box-inner .detailed-content .shipping-agent-box .shipping-agent-list-item .list-desc {
            margin-bottom: 0;
        }

body:has(header.is-scrolled) .ng-activities-section .ng-activities-nav {
    top: 160px;
}

body:has(header.is-scrolled) .ng-activities-section .ng-activities-tabs .tab-content .main-heading {
    top: 160px;
}

@media (max-width: 767.98px) {
    body:has(header.is-scrolled) .ng-activities-section .ng-activities-tabs .tab-content .main-heading {
        padding-top: 30px;
        top: 60px;
    }
}

body:has(header.is-hidden) .ng-activities-section .ng-activities-nav {
    top: 50px;
}

body:has(header.is-hidden) .ng-activities-section .ng-activities-tabs .tab-content .main-heading {
    top: 50px;
}

@media (max-width: 767.98px) {
    body:has(header.is-hidden) .ng-activities-section .ng-activities-tabs .tab-content .main-heading {
        padding-top: 30px;
        top: 0;
    }
}

.expandable-search {
    border: 1px solid var(--Black-black-100, var(--secondary));
    border-radius: 50rem;
    overflow: hidden;
    padding-inline-start: 10px;
    padding-inline-end: 15px;
    width: 136px;
    height: 50px;
    margin-inline-start: auto;
    transition: width 0.35s ease;
}

    .expandable-search .input-group {
        width: 100%;
    }

        .expandable-search .input-group .form-control {
            border: 0;
            border-radius: 50rem;
            height: 50px;
        }

            .expandable-search .input-group .form-control:focus {
                box-shadow: none;
            }

        .expandable-search .input-group .input-group-text {
            border: 0;
            background-color: transparent;
            padding: 0;
        }

            .expandable-search .input-group .input-group-text button {
                padding: 0;
                background-color: transparent;
                border: 0;
            }

html[dir=rtl] .expandable-search .input-group .input-group-text button {
    position: relative;
    top: -3px;
}

.expandable-search .input-group .input-group-text button img {
    width: 20px;
    height: 20px;
}

.link-with-double-arrow {
    color: var(--primary-accent);
    position: relative;
    padding-inline-end: 30px;
}

    .link-with-double-arrow::before {
        content: "";
        position: absolute;
        top: 50%;
        inset-inline-end: 0;
        transform: translate(0%, -45%);
        background-image: url("../images/icons/chevrons-right.svg");
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center center;
        width: 24px;
        height: 100%;
        transition: 0.3s all ease;
    }

html[dir=rtl] .link-with-double-arrow::before {
    transform: translate(0%, -45%) scaleX(-1);
}

.link-with-double-arrow:hover {
    text-decoration: underline;
    text-underline-offset: 5px;
    transition: 0.3s all ease;
}

.text-media-block {
    padding-block: 40px;
}

    .text-media-block .tmb-figure {
        display: block;
        margin: 0;
        height: 450px;
        overflow: hidden;
        border-radius: 16px;
        position: relative;
    }

        .text-media-block .tmb-figure img,
        .text-media-block .tmb-figure .tmb-video {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }

        .text-media-block .tmb-figure .ratio {
            height: 100%;
        }

            .text-media-block .tmb-figure .ratio::before {
                display: none;
            }

            .text-media-block .tmb-figure .ratio iframe {
                position: absolute;
                inset: 0;
                width: 100%;
                height: 100%;
                border: none;
            }

@media (max-width: 1199.98px) {
    .text-media-block .tmb-figure {
        height: 400px;
    }
}

@media (max-width: 991.98px) {
    .text-media-block .tmb-figure {
        height: 340px;
    }
}

@media (max-width: 767.98px) {
    .text-media-block .tmb-figure {
        height: 280px;
    }
}

@media (max-width: 575.98px) {
    .text-media-block .tmb-figure {
        height: 220px;
    }
}

.text-media-block .media-image {
    display: block;
}

.text-media-block .media-video {
    display: none;
}

.text-media-block .media-youtube {
    display: none;
}

.text-media-block .tmb-play-btn {
    display: none;
    position: absolute;
    bottom: 24px;
    inset-inline-start: 24px;
    width: 54px;
    height: 54px;
    background: rgba(0, 0, 0, 0.15);
    border: none;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 2;
    transition: background 0.2s ease;
}

    .text-media-block .tmb-play-btn::after {
        content: "";
        position: absolute;
        inset: 0;
        padding: 1px;
        border-radius: 50%;
        background: linear-gradient(221.22deg, rgba(255, 255, 255, 0) 36.55%, var(--surface) 142.1%);
        -webkit-mask: linear-gradient(var(--on-primary) 0 0) content-box, linear-gradient(var(--on-primary) 0 0);
        -webkit-mask-composite: xor;
        mask-composite: exclude;
        mask: linear-gradient(var(--on-primary) 0 0) content-box, linear-gradient(var(--on-primary) 0 0);
    }

    .text-media-block .tmb-play-btn:hover {
        background: rgba(0, 0, 0, 0.3);
    }

    .text-media-block .tmb-play-btn img {
        width: 18px;
        height: auto;
        position: relative;
        z-index: 1;
    }

.text-media-block .content-box {
    padding-inline-end: 32px;
}

.text-media-block .content-para {
    display: block;
    margin-block-start: 16px;
}

.text-media-block .content-cta {
    display: none;
    margin-block-start: 24px;
}

.text-media-block .content-read-more-wrap {
    display: none;
    margin-block-start: 16px;
}

    .text-media-block .content-read-more-wrap p.read-more-content {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

        .text-media-block .content-read-more-wrap p.read-more-content.collapsed {
            display: -webkit-box;
            -webkit-line-clamp: 10;
            line-clamp: 10;
        }

.text-media-block .content-list {
    display: none;
    list-style: none;
    padding: 0;
    margin-block-start: 16px;
}

    .text-media-block .content-list li {
        display: flex;
        gap: 10px;
        padding-block: 6px;
    }

        .text-media-block .content-list li::before {
            content: "•";
            flex-shrink: 0;
            font-size: 1.1em;
            line-height: inherit;
            color: inherit;
        }

.text-media-block .content-list-read-more-wrap {
    display: none;
    margin-block-start: 16px;
}

    .text-media-block .content-list-read-more-wrap ul.read-more-content {
        display: block;
        overflow: hidden;
        list-style: none;
        padding: 0;
        margin: 0;
        -webkit-line-clamp: unset;
        line-clamp: unset;
    }

        .text-media-block .content-list-read-more-wrap ul.read-more-content.collapsed {
            max-height: 220px;
        }

        .text-media-block .content-list-read-more-wrap ul.read-more-content li {
            display: flex;
            gap: 10px;
            padding-block: 6px;
        }

            .text-media-block .content-list-read-more-wrap ul.read-more-content li::before {
                content: "•";
                flex-shrink: 0;
                font-size: 1.1em;
                line-height: inherit;
                color: inherit;
            }

.text-media-block.with-uploaded-video .media-image {
    display: none;
}

.text-media-block.with-uploaded-video .media-video {
    display: block;
}

.text-media-block.with-youtube .media-image,
.text-media-block.with-youtube .media-video {
    display: none;
}

.text-media-block.with-youtube .media-youtube {
    display: block;
}

.text-media-block.video-no-controls .tmb-play-btn {
    display: flex;
}

.text-media-block.video-no-controls .tmb-video {
    cursor: pointer;
}

    .text-media-block.video-no-controls .tmb-video::-webkit-media-controls, .text-media-block.video-no-controls .tmb-video::-webkit-media-controls-enclosure, .text-media-block.video-no-controls .tmb-video::-webkit-media-controls-panel, .text-media-block.video-no-controls .tmb-video::-webkit-media-controls-play-button, .text-media-block.video-no-controls .tmb-video::-webkit-media-controls-timeline, .text-media-block.video-no-controls .tmb-video::-webkit-media-controls-current-time-display, .text-media-block.video-no-controls .tmb-video::-webkit-media-controls-time-remaining-display, .text-media-block.video-no-controls .tmb-video::-webkit-media-controls-mute-button, .text-media-block.video-no-controls .tmb-video::-webkit-media-controls-volume-slider, .text-media-block.video-no-controls .tmb-video::-webkit-media-controls-fullscreen-button {
        display: none !important;
        -webkit-appearance: none;
    }

.text-media-block.with-cta .content-cta {
    display: inline-flex;
}

.text-media-block.with-read-more .content-para {
    display: none;
}

.text-media-block.with-read-more .content-read-more-wrap {
    display: block;
}

.text-media-block.with-list .content-para {
    display: none;
}

.text-media-block.with-list .content-list {
    display: block;
}

.text-media-block.with-list-cta .content-para {
    display: none;
}

.text-media-block.with-list-cta .content-list {
    display: block;
}

.text-media-block.with-list-cta .content-cta {
    display: inline-flex;
}

.text-media-block.with-list-read-more .content-para {
    display: none;
}

.text-media-block.with-list-read-more .content-list-read-more-wrap {
    display: block;
}

.text-media-block.list-dash .content-list,
.text-media-block.list-dash .content-list-read-more-wrap ul.read-more-content {
    list-style: none;
    padding-inline-start: 0;
}

    .text-media-block.list-dash .content-list li,
    .text-media-block.list-dash .content-list-read-more-wrap ul.read-more-content li {
        display: flex;
        gap: 10px;
    }

        .text-media-block.list-dash .content-list li::before,
        .text-media-block.list-dash .content-list-read-more-wrap ul.read-more-content li::before {
            content: "–";
            flex-shrink: 0;
            color: inherit;
        }

.text-media-block.reverse .content-box {
    padding-inline-end: 0;
    padding-inline-start: 32px;
}

@media (max-width: 767.98px) {
    .text-media-block {
        padding-block: 40px;
    }

        .text-media-block .content-box {
            padding-inline: 0;
            margin-block-end: 32px;
        }
}

.all-in-one-text-media-block-section .tmb-tabs {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 72px;
    overflow: auto;
    cursor: grab;
    flex-wrap: nowrap;
    scrollbar-width: none;
    border: 0;
}

    .all-in-one-text-media-block-section .tmb-tabs::-webkit-scrollbar {
        display: none;
    }

    .all-in-one-text-media-block-section .tmb-tabs.dragging {
        cursor: grabbing;
        user-select: none;
    }

    .all-in-one-text-media-block-section .tmb-tabs .nav-item {
        flex-shrink: 0;
    }

    .all-in-one-text-media-block-section .tmb-tabs .nav-link {
        color: var(--text-muted);
        font-size: 16px;
        font-weight: 400;
        border: none;
        border-bottom: 3px solid transparent;
        border-radius: 0;
        padding: 10px 0;
        white-space: nowrap;
        transition: all 0.3s ease-in-out;
    }

        .all-in-one-text-media-block-section .tmb-tabs .nav-link:hover, .all-in-one-text-media-block-section .tmb-tabs .nav-link.active {
            color: var(--primary-accent);
            background: transparent;
            border-bottom: 3px solid var(--primary);
        }

@media (max-width: 767.98px) {
    .all-in-one-text-media-block-section .tmb-tabs {
        justify-content: flex-start;
    }

        .all-in-one-text-media-block-section .tmb-tabs .nav-link {
            white-space: nowrap;
        }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .all-in-one-text-media-block-section .tmb-tabs {
        gap: 32px;
    }
}

@media (max-width: 575.98px) {
    .all-in-one-text-media-block-section .tmb-tabs {
        gap: 16px;
    }
}

.all-in-one-text-media-block-section .tmb-tab-content .tab-pane {
    padding: 0;
}

/*!
* Style Sheet for ""
* version: 1
* last modified:2023 By Applab
* author: Applab
* website: www.applab.qa
*/
.alert-primary {
    --bs-alert-color: var(--bs-primary-text);
    --bs-alert-bg: var(--bs-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-primary-border-subtle);
    --bs-alert-link-color: var(--bs-primary-text);
}

.alert-white {
    --bs-alert-color: var(--bs-white-text);
    --bs-alert-bg: var(--bs-white-bg-subtle);
    --bs-alert-border-color: var(--bs-white-border-subtle);
    --bs-alert-link-color: var(--bs-white-text);
}

.alert-black {
    --bs-alert-color: var(--bs-black-text);
    --bs-alert-bg: var(--bs-black-bg-subtle);
    --bs-alert-border-color: var(--bs-black-border-subtle);
    --bs-alert-link-color: var(--bs-black-text);
}

.alert-secondary {
    --bs-alert-color: var(--bs-secondary-text);
    --bs-alert-bg: var(--bs-secondary-bg-subtle);
    --bs-alert-border-color: var(--bs-secondary-border-subtle);
    --bs-alert-link-color: var(--bs-secondary-text);
}

.alert-light-primary {
    --bs-alert-color: var(--bs-light-primary-text);
    --bs-alert-bg: var(--bs-light-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-light-primary-border-subtle);
    --bs-alert-link-color: var(--bs-light-primary-text);
}

.alert-light-bg {
    --bs-alert-color: var(--bs-light-bg-text);
    --bs-alert-bg: var(--bs-light-bg-bg-subtle);
    --bs-alert-border-color: var(--bs-light-bg-border-subtle);
    --bs-alert-link-color: var(--bs-light-bg-text);
}

.alert-grey {
    --bs-alert-color: var(--bs-grey-text);
    --bs-alert-bg: var(--bs-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-grey-border-subtle);
    --bs-alert-link-color: var(--bs-grey-text);
}

.alert-purple {
    --bs-alert-color: var(--bs-purple-text);
    --bs-alert-bg: var(--bs-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-purple-border-subtle);
    --bs-alert-link-color: var(--bs-purple-text);
}

.alert-dark-purple {
    --bs-alert-color: var(--bs-dark-purple-text);
    --bs-alert-bg: var(--bs-dark-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-purple-border-subtle);
    --bs-alert-link-color: var(--bs-dark-purple-text);
}

.alert-violet {
    --bs-alert-color: var(--bs-violet-text);
    --bs-alert-bg: var(--bs-violet-bg-subtle);
    --bs-alert-border-color: var(--bs-violet-border-subtle);
    --bs-alert-link-color: var(--bs-violet-text);
}

.alert-dark-grey {
    --bs-alert-color: var(--bs-dark-grey-text);
    --bs-alert-bg: var(--bs-dark-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-grey-border-subtle);
    --bs-alert-link-color: var(--bs-dark-grey-text);
}

.alert-light-black {
    --bs-alert-color: var(--bs-light-black-text);
    --bs-alert-bg: var(--bs-light-black-bg-subtle);
    --bs-alert-border-color: var(--bs-light-black-border-subtle);
    --bs-alert-link-color: var(--bs-light-black-text);
}

.alert-border-color {
    --bs-alert-color: var(--bs-border-color-text);
    --bs-alert-bg: var(--bs-border-color-bg-subtle);
    --bs-alert-border-color: var(--bs-border-color-border-subtle);
    --bs-alert-link-color: var(--bs-border-color-text);
}

.alert-grey1 {
    --bs-alert-color: var(--bs-grey1-text);
    --bs-alert-bg: var(--bs-grey1-bg-subtle);
    --bs-alert-border-color: var(--bs-grey1-border-subtle);
    --bs-alert-link-color: var(--bs-grey1-text);
}

.alert-grey2 {
    --bs-alert-color: var(--bs-grey2-text);
    --bs-alert-bg: var(--bs-grey2-bg-subtle);
    --bs-alert-border-color: var(--bs-grey2-border-subtle);
    --bs-alert-link-color: var(--bs-grey2-text);
}

.alert-gray-color {
    --bs-alert-color: var(--bs-gray-color-text);
    --bs-alert-bg: var(--bs-gray-color-bg-subtle);
    --bs-alert-border-color: var(--bs-gray-color-border-subtle);
    --bs-alert-link-color: var(--bs-gray-color-text);
}

.alert-gray3 {
    --bs-alert-color: var(--bs-gray3-text);
    --bs-alert-bg: var(--bs-gray3-bg-subtle);
    --bs-alert-border-color: var(--bs-gray3-border-subtle);
    --bs-alert-link-color: var(--bs-gray3-text);
}

.alert-light-grey {
    --bs-alert-color: var(--bs-light-grey-text);
    --bs-alert-bg: var(--bs-light-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-light-grey-border-subtle);
    --bs-alert-link-color: var(--bs-light-grey-text);
}

.bg-primary {
    background: var(--primary) !important;
}

.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
    }

.btn-outline-primary {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary-accent);
}

    .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
        box-shadow: none;
        outline: none;
    }

.text-primary {
    color: var(--primary-accent) !important;
}

.bg-white {
    background: var(--surface) !important;
}

.btn-white {
    background: var(--surface);
    border-color: var(--on-primary);
}

    .btn-white:hover, .btn-white:focus, .btn-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
    }

.btn-outline-white {
    background: transparent;
    border-color: var(--on-primary);
    color: var(--on-primary);
}

    .btn-outline-white:hover, .btn-outline-white:focus, .btn-outline-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
        box-shadow: none;
        outline: none;
    }

.text-white {
    color: var(--on-primary) !important;
}

.bg-black {
    background: var(--black) !important;
}

.btn-black {
    background: var(--black);
    border-color: var(--black);
}

    .btn-black:hover, .btn-black:focus, .btn-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
    }

.btn-outline-black {
    background: transparent;
    border-color: var(--black);
    color: var(--text);
}

    .btn-outline-black:hover, .btn-outline-black:focus, .btn-outline-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
        box-shadow: none;
        outline: none;
    }

.text-black {
    color: var(--text) !important;
}

.bg-secondary {
    background: var(--text-muted) !important;
}

.btn-secondary {
    background: var(--text-muted);
    border-color: var(--text-muted);
}

    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
    }

.btn-outline-secondary {
    background: transparent;
    border-color: var(--text-muted);
    color: var(--text-muted);
}

    .btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
        box-shadow: none;
        outline: none;
    }

.text-secondary {
    color: var(--text-muted) !important;
}

.bg-light-primary {
    background: var(--light-primary) !important;
}

.btn-light-primary {
    background: var(--light-primary);
    border-color: var(--light-primary);
}

    .btn-light-primary:hover, .btn-light-primary:focus, .btn-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
    }

.btn-outline-light-primary {
    background: transparent;
    border-color: var(--light-primary);
    color: var(--light-primary);
}

    .btn-outline-light-primary:hover, .btn-outline-light-primary:focus, .btn-outline-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
        box-shadow: none;
        outline: none;
    }

.text-light-primary {
    color: var(--light-primary) !important;
}

.bg-light-bg {
    background: var(--light-bg) !important;
}

.btn-light-bg {
    background: var(--light-bg);
    border-color: var(--light-bg);
}

    .btn-light-bg:hover, .btn-light-bg:focus, .btn-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
    }

.btn-outline-light-bg {
    background: transparent;
    border-color: var(--light-bg);
    color: var(--light-bg);
}

    .btn-outline-light-bg:hover, .btn-outline-light-bg:focus, .btn-outline-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
        box-shadow: none;
        outline: none;
    }

.text-light-bg {
    color: var(--light-bg) !important;
}

.bg-grey {
    background: var(--grey) !important;
}

.btn-grey {
    background: var(--grey);
    border-color: var(--grey);
}

    .btn-grey:hover, .btn-grey:focus, .btn-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
    }

.btn-outline-grey {
    background: transparent;
    border-color: var(--grey);
    color: var(--grey);
}

    .btn-outline-grey:hover, .btn-outline-grey:focus, .btn-outline-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
        box-shadow: none;
        outline: none;
    }

.text-grey {
    color: var(--grey) !important;
}

.bg-purple {
    background: var(--purple) !important;
}

.btn-purple {
    background: var(--purple);
    border-color: var(--purple);
}

    .btn-purple:hover, .btn-purple:focus, .btn-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
    }

.btn-outline-purple {
    background: transparent;
    border-color: var(--purple);
    color: var(--purple);
}

    .btn-outline-purple:hover, .btn-outline-purple:focus, .btn-outline-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
        box-shadow: none;
        outline: none;
    }

.text-purple {
    color: var(--purple) !important;
}

.bg-dark-purple {
    background: var(--dark-purple) !important;
}

.btn-dark-purple {
    background: var(--dark-purple);
    border-color: var(--dark-purple);
}

    .btn-dark-purple:hover, .btn-dark-purple:focus, .btn-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
    }

.btn-outline-dark-purple {
    background: transparent;
    border-color: var(--dark-purple);
    color: var(--dark-purple);
}

    .btn-outline-dark-purple:hover, .btn-outline-dark-purple:focus, .btn-outline-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
        box-shadow: none;
        outline: none;
    }

.text-dark-purple {
    color: var(--dark-purple) !important;
}

.bg-violet {
    background: var(--violet) !important;
}

.btn-violet {
    background: var(--violet);
    border-color: var(--violet);
}

    .btn-violet:hover, .btn-violet:focus, .btn-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
    }

.btn-outline-violet {
    background: transparent;
    border-color: var(--violet);
    color: var(--primary-accent);
}

    .btn-outline-violet:hover, .btn-outline-violet:focus, .btn-outline-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
        box-shadow: none;
        outline: none;
    }

.text-violet {
    color: var(--primary-accent) !important;
}

.bg-dark-grey {
    background: var(--dark-grey) !important;
}

.btn-dark-grey {
    background: var(--dark-grey);
    border-color: var(--dark-grey);
}

    .btn-dark-grey:hover, .btn-dark-grey:focus, .btn-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
    }

.btn-outline-dark-grey {
    background: transparent;
    border-color: var(--dark-grey);
    color: var(--dark-grey);
}

    .btn-outline-dark-grey:hover, .btn-outline-dark-grey:focus, .btn-outline-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
        box-shadow: none;
        outline: none;
    }

.text-dark-grey {
    color: var(--dark-grey) !important;
}

.bg-light-black {
    background: var(--light-black) !important;
}

.btn-light-black {
    background: var(--light-black);
    border-color: var(--light-black);
}

    .btn-light-black:hover, .btn-light-black:focus, .btn-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
    }

.btn-outline-light-black {
    background: transparent;
    border-color: var(--light-black);
    color: var(--light-black);
}

    .btn-outline-light-black:hover, .btn-outline-light-black:focus, .btn-outline-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
        box-shadow: none;
        outline: none;
    }

.text-light-black {
    color: var(--light-black) !important;
}

.bg-border-color {
    background: var(--border-color) !important;
}

.btn-border-color {
    background: var(--border-color);
    border-color: var(--border-color);
}

    .btn-border-color:hover, .btn-border-color:focus, .btn-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
    }

.btn-outline-border-color {
    background: transparent;
    border-color: var(--border-color);
    color: var(--border-color);
}

    .btn-outline-border-color:hover, .btn-outline-border-color:focus, .btn-outline-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
        box-shadow: none;
        outline: none;
    }

.text-border-color {
    color: var(--border-color) !important;
}

.bg-grey1 {
    background: var(--grey1) !important;
}

.btn-grey1 {
    background: var(--grey1);
    border-color: var(--grey1);
}

    .btn-grey1:hover, .btn-grey1:focus, .btn-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
    }

.btn-outline-grey1 {
    background: transparent;
    border-color: var(--grey1);
    color: var(--grey1);
}

    .btn-outline-grey1:hover, .btn-outline-grey1:focus, .btn-outline-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
        box-shadow: none;
        outline: none;
    }

.text-grey1 {
    color: var(--grey1) !important;
}

.bg-grey2 {
    background: var(--grey2) !important;
}

.btn-grey2 {
    background: var(--grey2);
    border-color: var(--grey2);
}

    .btn-grey2:hover, .btn-grey2:focus, .btn-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
    }

.btn-outline-grey2 {
    background: transparent;
    border-color: var(--grey2);
    color: var(--grey2);
}

    .btn-outline-grey2:hover, .btn-outline-grey2:focus, .btn-outline-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
        box-shadow: none;
        outline: none;
    }

.text-grey2 {
    color: var(--grey2) !important;
}

.bg-gray-color {
    background: var(--gray-color) !important;
}

.btn-gray-color {
    background: var(--gray-color);
    border-color: var(--gray-color);
}

    .btn-gray-color:hover, .btn-gray-color:focus, .btn-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
    }

.btn-outline-gray-color {
    background: transparent;
    border-color: var(--gray-color);
    color: var(--gray-color);
}

    .btn-outline-gray-color:hover, .btn-outline-gray-color:focus, .btn-outline-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
        box-shadow: none;
        outline: none;
    }

.text-gray-color {
    color: var(--gray-color) !important;
}

.bg-gray3 {
    background: var(--gray3) !important;
}

.btn-gray3 {
    background: var(--gray3);
    border-color: var(--gray3);
}

    .btn-gray3:hover, .btn-gray3:focus, .btn-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
    }

.btn-outline-gray3 {
    background: transparent;
    border-color: var(--gray3);
    color: var(--gray3);
}

    .btn-outline-gray3:hover, .btn-outline-gray3:focus, .btn-outline-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
        box-shadow: none;
        outline: none;
    }

.text-gray3 {
    color: var(--gray3) !important;
}

.bg-light-grey {
    background: var(--light-grey) !important;
}

.btn-light-grey {
    background: var(--light-grey);
    border-color: var(--light-grey);
}

    .btn-light-grey:hover, .btn-light-grey:focus, .btn-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
    }

.btn-outline-light-grey {
    background: transparent;
    border-color: var(--light-grey);
    color: var(--light-grey);
}

    .btn-outline-light-grey:hover, .btn-outline-light-grey:focus, .btn-outline-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
        box-shadow: none;
        outline: none;
    }

.text-light-grey {
    color: var(--light-grey) !important;
}

.fs-56 {
    font-size: clamp(30px, 30px + 0vw, 30px);
}

@media (min-width: 768px) {
    .fs-56 {
        font-size: clamp(30px, 30px + 0vw, 30px);
    }
}

@media (min-width: 1200px) {
    .fs-56 {
        font-size: clamp(30px, -13.3333333333px + 3.6111111111vw, 56px);
    }
}

.fs-40 {
    font-size: clamp(18px, 13.7142857143px + 1.3392857143vw, 24px);
}

@media (min-width: 768px) {
    .fs-40 {
        font-size: clamp(24px, 24px + 0vw, 24px);
    }
}

@media (min-width: 1200px) {
    .fs-40 {
        font-size: clamp(24px, -2.6666666667px + 2.2222222222vw, 40px);
    }
}

.fs-38 {
    font-size: clamp(18px, 15.1428571429px + 0.8928571429vw, 22px);
}

@media (min-width: 768px) {
    .fs-38 {
        font-size: clamp(22px, 22px + 0vw, 22px);
    }
}

@media (min-width: 1200px) {
    .fs-38 {
        font-size: clamp(22px, -4.6666666667px + 2.2222222222vw, 38px);
    }
}

.fs-32 {
    font-size: clamp(18px, 16.5714285714px + 0.4464285714vw, 20px);
}

@media (min-width: 768px) {
    .fs-32 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .fs-32 {
        font-size: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.fs-28 {
    font-size: clamp(16px, 14.5714285714px + 0.4464285714vw, 18px);
}

@media (min-width: 768px) {
    .fs-28 {
        font-size: clamp(18px, 18px + 0vw, 18px);
    }
}

@media (min-width: 1200px) {
    .fs-28 {
        font-size: clamp(18px, 1.3333333333px + 1.3888888889vw, 28px);
    }
}

.fs-24 {
    font-size: clamp(16px, 16px + 0vw, 16px);
}

@media (min-width: 768px) {
    .fs-24 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-24 {
        font-size: clamp(16px, 2.6666666667px + 1.1111111111vw, 24px);
    }
}

.fs-22 {
    font-size: clamp(14px, 12.5714285714px + 0.4464285714vw, 16px);
}

@media (min-width: 768px) {
    .fs-22 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-22 {
        font-size: clamp(16px, 6px + 0.8333333333vw, 22px);
    }
}

.fs-20 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-20 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-20 {
        font-size: clamp(12px, -1.3333333333px + 1.1111111111vw, 20px);
    }
}

.fs-18 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-18 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-18 {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

.fs-16 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-16 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-16 {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

.fs-15 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-15 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-15 {
        font-size: clamp(12px, 7px + 0.4166666667vw, 15px);
    }
}

.fs-14 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-14 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-14 {
        font-size: clamp(10px, 3.3333333333px + 0.5555555556vw, 14px);
    }
}

.fs-12 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-12 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-12 {
        font-size: clamp(10px, 6.6666666667px + 0.2777777778vw, 12px);
    }
}

.section-title {
    text-align: start;
}

@media (max-width: 767.98px) {
    .section-title {
        margin-bottom: 24px !important;
    }
}

@media (max-width: 991.98px) {
    .section-title {
        padding-inline: 0 !important;
    }
}

.sub-title {
    text-transform: none;
    text-align: start;
    color: var(--text-muted);
}

.breadcrumb-menu {
    background-color: var(--surface-2);
    border: 1px solid var(--border-color);
    padding: 18px 0;
}

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
        content: var(--bs-breadcrumb-divider, ">");
        color: var(--purple);
        float: inline-start !important;
        padding-inline-end: var(--bs-breadcrumb-item-padding-x) !important;
    }

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item a {
        font-weight: 400;
        font-size: 16px;
        line-height: 19px;
        letter-spacing: -0.18px;
        color: var(--text-muted);
    }

        .breadcrumb-menu nav .breadcrumb .breadcrumb-item a.active {
            color: var(--purple);
        }

.cardSwiper {
    padding-bottom: 60px !important;
}

@media (max-width: 767.98px) {
    .cardSwiper {
        margin-top: 0 !important;
    }
}

.cardSwiper.swiper {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-block-end: 5rem;
    padding-inline-start: 0;
    padding-inline-end: 0;
}

    .cardSwiper.swiper .swiper-pagination {
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 10px 18px;
        width: auto;
        height: 45px;
        background: rgba(174, 174, 174, 0.2);
        border-radius: 98px;
        left: unset;
        bottom: 0px;
    }

        .cardSwiper.swiper .swiper-pagination .swiper-pagination-bullet {
            width: 14px;
            height: 14px;
            background: var(--surface) !important;
            opacity: 1;
        }

            .cardSwiper.swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
                background: var(--purple) !important;
            }

.cardSwiper .card {
    background: var(--surface);
    border: 1.5px solid var(--border-color);
    border-radius: 16px;
    height: 120px;
    margin: 2px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

@media (max-width: 575.98px) {
    .cardSwiper .card {
        width: 100%;
        height: 120px;
    }
}

.cardSwiper .card .card-body {
    padding: 16px;
    display: flex;
    align-items: center;
    flex: 1;
    overflow: hidden;
    min-height: 0;
    position: relative;
}

.cardSwiper .card.card-journey {
    transition: all 0.5s ease-in-out;
}

    .cardSwiper .card.card-journey .card-body {
        overflow: hidden;
        gap: 12px;
    }

    .cardSwiper .card.card-journey a.card-title {
        color: var(--text-muted);
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        min-width: 0;
        flex: 1;
        overflow: hidden;
        word-wrap: break-word;
        line-height: 1.5;
        padding-inline-end: 24px;
        text-decoration: none;
    }

    .cardSwiper .card.card-journey a:not(.card-title) {
        color: var(--text-muted);
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .cardSwiper .card.card-journey img {
        transition: all 0.3s ease-in-out;
    }

    .cardSwiper .card.card-journey:hover {
        border: 1.5px solid rgba(98, 62, 90, 0.3);
    }

        .cardSwiper .card.card-journey:hover img {
            filter: invert(44%) sepia(33%) saturate(447%) hue-rotate(221deg) brightness(95%) contrast(90%);
        }

        .cardSwiper .card.card-journey:hover a,
        .cardSwiper .card.card-journey:hover .arrow-icon {
            color: var(--purple);
        }

        .cardSwiper .card.card-journey:hover .arrow-icon {
            inset-inline-end: 30px;
            opacity: 1;
        }

    .cardSwiper .card.card-journey .arrow-icon {
        position: absolute;
        inset-inline-end: 15px;
        opacity: 0;
        font-size: 20px;
        transition: all 0.25s cubic-bezier(0.31, -0.105, 0.43, 1.4);
        cursor: pointer;
    }

html[dir=rtl] .cardSwiper .card.card-journey .arrow-icon {
    transform: scaleX(-1);
}

.cardSwiper .card .icon-box {
    height: 100px;
    width: 100px;
    min-height: 100px;
    min-width: 100px;
    max-width: 100px;
    max-height: 100px;
    border-radius: 8px;
    padding: 10px;
    margin-inline-end: 12px;
    opacity: 1;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
}

@media (max-width: 575.98px) {
    .cardSwiper .card .icon-box {
        height: 80px;
        width: 80px;
        min-height: 80px;
        min-width: 80px;
        max-width: 80px;
        max-height: 80px;
    }
}

.cardSwiper .card .icon-box figure {
    margin: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cardSwiper .card .icon-box img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}

.imageSwiper.swiper {
    overflow-x: clip !important;
    overflow-y: visible !important;
}

    .imageSwiper.swiper .swiper-slide {
        margin-inline-end: 20px;
    }

        .imageSwiper.swiper .swiper-slide a {
            color: inherit;
        }

        .imageSwiper.swiper .swiper-slide figure img {
            border-radius: 16px;
            aspect-ratio: 524/300;
            object-fit: cover;
        }

        .imageSwiper.swiper .swiper-slide .fig-caption {
            padding-block: 1.5rem;
        }

            .imageSwiper.swiper .swiper-slide .fig-caption h2 {
                line-height: 31px;
                display: -webkit-box;
                -webkit-line-clamp: 1;
                -webkit-box-orient: vertical;
                overflow: hidden;
            }

            .imageSwiper.swiper .swiper-slide .fig-caption p {
                line-height: 25px;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                overflow: hidden;
            }

@media (max-width: 767.98px) {
    .imageSwiper.swiper .swiper-slide figure img {
        aspect-ratio: 2;
    }

    .imageSwiper.swiper .swiper-slide .fig-caption h2 {
        line-height: 28px;
    }
}

.imageSwiper.swiper .swiper-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px 18px;
    width: auto;
    height: 45px;
    background: rgba(174, 174, 174, 0.2);
    border-radius: 98px;
    inset-inline-start: unset;
    margin-bottom: -66px;
    position: absolute;
    inset-inline-start: 50%;
    transform: translateX(-50%);
}

@media (max-width: 1199.98px) {
    .imageSwiper.swiper .swiper-pagination {
        margin-bottom: -50px;
        position: absolute;
        bottom: 80px;
    }
}

html[dir=rtl] .imageSwiper.swiper .swiper-pagination {
    width: fit-content;
    inset-inline-start: unset;
    inset-inline-end: 50%;
    transform: translateX(-50%);
}

.imageSwiper.swiper .swiper-pagination .swiper-pagination-bullet {
    width: 14px;
    height: 14px;
    background: var(--surface) !important;
    opacity: 1;
}

    .imageSwiper.swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
        background: var(--purple) !important;
    }

.swiper-button-next,
.swiper-button-prev {
    position: absolute;
    top: -88px;
    gap: 8px;
    width: 54px;
    height: 54px;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 100%;
    font-size: 0;
    border: 1px solid var(--purple);
    z-index: 9;
}

    .swiper-button-next::after,
    .swiper-button-prev::after {
        font-family: bootstrap-icons !important;
        color: var(--purple);
        font-size: 1.25rem;
    }

    .swiper-button-next:hover,
    .swiper-button-prev:hover {
        background: var(--violet);
    }

        .swiper-button-next:hover::after,
        .swiper-button-prev:hover::after {
            color: var(--on-primary);
        }

@media (max-width: 575.98px) {
    .swiper-button-next,
    .swiper-button-prev {
        width: 40px;
        height: 40px;
    }
}

.swiper-button-next::after {
    content: "\f285" !important;
}

html[dir=rtl] .swiper-button-next {
    transform: scaleX(-1);
}

/* Position next logically (like prev) so the pair stays grouped and mirrors
   together in RTL, instead of next staying on the physical right. */
.swiper-button-next {
    inset-inline-start: unset !important;
    inset-inline-end: 10px !important;
}

.swiper-button-prev {
    inset-inline-start: unset !important;
    inset-inline-end: 80px !important;
}

html[dir=rtl] .swiper-button-prev {
    transform: scaleX(-1);
}

@media (max-width: 575.98px) {
    .swiper-button-prev {
        inset-inline-end: 60px;
    }
}

.swiper-button-prev::after {
    content: "\f284" !important;
}

.event-details {
    border-bottom: 1px solid var(--border);
    padding-block: 1.5rem;
}

    .event-details p {
        font-weight: 400;
        font-size: 14px !important;
        color: var(--text-muted);
        margin-bottom: 0;
    }

    .event-details i {
        font-size: 8px;
        color: var(--purple);
    }

    .event-details a {
        line-height: 28px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

@media (max-width: 767.98px) {
    .event-details a {
        font-size: 18px;
        line-height: 26px;
    }
}

.key-details {
    position: sticky;
    top: 0;
}

@media (min-width: 768px) {
    .key-details {
        top: -12%;
        margin-top: -18%;
    }
}

.key-details .card {
    border: 0;
}

.key-details .card-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 20px 40px;
    gap: 32px;
    height: 70px;
    background: rgba(229, 229, 230, 0.8);
    border-radius: 16px 16px 0px 0px !important;
    border: 0;
    position: sticky;
    top: 0;
    z-index: 9;
}

.key-details .card-body {
    border: 1px solid var(--border-color);
    border-top: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 40px 40px 48px;
    gap: 32px;
    height: 730px;
    border-radius: 0 0 16px 16px !important;
    z-index: 9;
    background-color: var(--surface);
}

.key-details .card-details-item {
    border-bottom: 1px solid var(--border-color);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    width: 100%;
    padding-bottom: 16px;
}

    .key-details .card-details-item figure img {
        border: 1px solid var(--border-color);
        border-radius: 12px;
    }

    .key-details .card-details-item iframe {
        width: 100%;
        height: 150px;
        border: 1px solid #E7E7E7;
        border-radius: 12px;
    }

.setup {
    background: linear-gradient(298.1deg, var(--purple) 3.27%, var(--violet) 125.83%);
    border-radius: 16px 0 0 16px;
    padding: 6rem 4rem;
    position: relative;
    box-sizing: border-box;
    max-width: 100%;
}

html[dir=rtl] .setup {
    border-radius: 0 16px 16px 0px;
}

@media (max-width: 767.98px) {
    .setup {
        padding: 40px 15px !important;
        border-radius: 16px;
        margin-bottom: 20px;
        max-width: 100%;
    }
}

.setup .btn {
    line-height: 1;
    background: var(--surface);
    border-radius: 72px;
    font-family: var(--primary-font);
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--on-primary);
    text-align: center;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    transition: none;
}

@media (max-width: 767.98px) {
    .setup .btn {
        padding-inline: 10px !important;
        height: 40px;
    }
}

.setup .btn i {
    font-size: 9px;
    color: var(--on-primary);
    display: none;
    align-items: center;
}

@media (max-width: 767.98px) {
    .setup .btn {
        font-size: 12px !important;
    }
}

@media (min-width: 992px) and (max-width: 1400px) {
    .setup .btn {
        font-size: 12px !important;
    }
}

.setup .btn span {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: none;
    transform: none;
}

    .setup .btn span i {
        opacity: 1;
        transition: opacity 0.35s ease, transform 0.35s ease;
        display: none;
    }

.setup .btn:hover {
    background: linear-gradient(-93.64deg, var(--primary) -23.72%, var(--purple) 82.41%);
}

    .setup .btn:hover span i {
        opacity: 0;
        transform: translateX(500%);
    }

html[dir=rtl] .setup .btn:hover span i {
    transform: translateX(-500%);
}

.setup .btn:hover span::before {
    opacity: 1;
}

.setup .btn.btn-transparent {
    border: 1px solid rgba(51, 51, 51, 0.1019607843);
    color: var(--purple);
}

    .setup .btn.btn-transparent i {
        color: var(--purple) !important;
    }

.setup-figure {
    position: relative;
    overflow: hidden;
    border-radius: 0 16px 16px 0px;
    max-width: 100%;
    box-sizing: border-box;
}

@media (max-width: 767.98px) {
    .setup-figure {
        padding: 0 !important;
        border-radius: 16px !important;
        max-width: 100%;
        overflow: hidden;
    }
}

html[dir=rtl] .setup-figure {
    border-radius: 16px 0 0 16px;
}

    html[dir=rtl] .setup-figure.ps-0 {
        padding-inline-start: 0 !important;
    }

.setup-figure figure {
    height: 100%;
    max-width: 100%;
    margin: 0;
}

    .setup-figure figure img {
        height: 100%;
        width: 100%;
        max-width: 100%;
        object-fit: cover;
        transition: all 0.3s ease-in-out;
    }

.start-business:has(.new-styles) {
    padding-block: 60px;
}

    .start-business:has(.new-styles):hover .setup-figure figure img {
        scale: none;
    }

    .start-business:has(.new-styles) .setup-figure figure {
        border-radius: 0 16px 16px 0;
    }

        .start-business:has(.new-styles) .setup-figure figure img {
            width: 100%;
        }

    .start-business:has(.new-styles) .new-styles {
        display: flex;
        flex-direction: column;
        align-items: start;
        justify-content: center;
    }

.accordion {
    background-color: var(--surface-2);
    border-radius: 16px;
    padding: 40px;
}

@media (max-width: 767.98px) {
    .accordion {
        padding: 20px;
    }
}

.accordion-button {
    font-style: normal;
    font-weight: 500;
    font-size: 20px !important;
    display: flex;
    align-items: center;
    background-color: transparent !important;
    color: var(--text) !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin-bottom: 12px;
}

    .accordion-button:focus {
        outline: none !important;
        box-shadow: none !important;
    }

@media (max-width: 767.98px) {
    .accordion-button {
        font-size: 16px !important;
        padding: 5px;
    }

        .accordion-button::after {
            width: 18px !important;
            height: 18px !important;
            inset-inline-end: 0 !important;
            font-size: 18px !important;
        }

        .accordion-button span {
            white-space: pre-line;
            margin-inline-end: 2rem;
        }
}

.accordion-button:not(.collapsed) {
    background-color: transparent;
    border: 0;
    box-shadow: none;
}

.accordion-button::after {
    transition: transform 0.15s ease-in-out;
    position: absolute;
    inset-inline-end: 0;
    padding: 15px !important;
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 100%;
    border: none !important;
    background-size: 0;
    content: "\f4fe" !important;
    font-family: bootstrap-icons !important;
    color: var(--text);
    font-weight: 500 !important;
    vertical-align: middle;
    justify-content: center;
    display: flex;
    align-items: center;
    background-image: none !important;
}

@media (min-width: 768px) {
    .accordion-button::after {
        width: 45px !important;
        height: 45px !important;
        font-size: 24px !important;
    }
}

.accordion-button:not(.collapsed)::after {
    transform: rotate(45deg) !important;
    transition: transform 0.15s ease-in-out;
}

.accordion-button:focus {
    box-shadow: none;
}

.accordion-item {
    border: 0 !important;
    border-radius: 0;
    padding-block: 12px;
    margin-bottom: 16px;
    border-radius: 16px;
    background-color: transparent !important;
}

@media (max-width: 767.98px) {
    .accordion-item {
        margin-bottom: 0 !important;
    }
}

.accordion-item:last-child {
    border-bottom: 0;
}

.accordion-body {
    font-weight: 400;
    font-size: 16px;
    color: var(--text-muted);
    padding-block: 5px;
    padding: 0 !important;
    max-width: 90%;
}

@media (max-width: 767.98px) {
    .accordion-body {
        font-size: 14px;
        padding: 5px;
    }
}

.discover-qatar .video-container {
    --bs-aspect-ratio: 47%;
}

    .discover-qatar .video-container iframe {
        height: 100% !important;
        width: 100% !important;
        border-radius: 16px;
        overflow: hidden;
    }

    .discover-qatar .video-container .discover-video-btn {
        top: 87%;
        left: 32px;
    }

.discover-img {
    height: 502px !important;
    object-fit: cover;
}

@media (min-width: 992px) and (max-width: 1400px) {
    .discover-img {
        height: 350px !important;
    }
}

.discover-keys.py-60 {
    padding-bottom: 44px !important;
}

.discover-keys .tabs-wrapper {
    position: relative;
}

.discover-keys .btn:hover img {
    filter: invert(1) brightness(1.5);
}

.discover-keys.experience-tabs .col-lg-7,
.discover-keys.experience-tabs .col-lg-5 {
    margin-bottom: 0 !important;
}

.discover-keys.experience-tabs figure {
    margin-bottom: 0 !important;
    width: 100%;
    height: 100%;
    max-height: 300px;
    height: 300px;
    aspect-ratio: 16/9;
    overflow: hidden;
}

    .discover-keys.experience-tabs figure img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.new-tabs .tabs-wrapper {
    display: flex;
    flex-direction: row;
    align-items: center;
    overflow: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

    .new-tabs .tabs-wrapper::-webkit-scrollbar {
        display: none;
    }

.new-tabs .tab-content {
    background: var(--surface-2);
    padding: 40px 48px;
    border-radius: 16px;
}

    .new-tabs .tab-content .btn-transparent {
        background-color: transparent !important;
    }

@media (max-width: 767.98px) {
    .new-tabs .tab-content {
        padding: 40px 15px 0;
    }
}

.new-tabs .tab-content:has(.tab-pane:first-child.active) {
    border-start-start-radius: 0 !important;
}

.new-tabs .tab-content .tab-pane .p-content,
.new-tabs .tab-content .tab-pane figure {
    opacity: 0;
}

.new-tabs .tab-content .tab-pane.active .p-content,
.new-tabs .tab-content .tab-pane.active figure {
    opacity: 1;
    animation: fadeIn 1s ease-in-out;
}

.new-btn-tab {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 12px 48px 6px;
    gap: 20px;
    font-size: 20px;
    font-size: clamp(12px, 10.5714285714px + 0.4464285714vw, 14px);
    font-weight: 500;
    color: var(--text-muted);
    transition: none !important;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@media (min-width: 768px) {
    .new-btn-tab {
        font-size: clamp(14px, 14px + 0vw, 14px);
    }
}

@media (min-width: 1200px) {
    .new-btn-tab {
        font-size: clamp(14px, 4px + 0.8333333333vw, 20px);
    }
}

.new-btn-tab.active {
    background: var(--surface-2);
    border-radius: 12px 12px 0px 0px;
}

@media (max-width: 767.98px) {
    .new-btn-tab.active {
        overflow: visible;
    }
}

@media (max-width: 767.98px) {
    .new-btn-tab {
        padding: 15px !important;
        white-space: nowrap;
        font-size: 16px !important;
        display: flex;
        overflow: visible;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.ecosystem-overview.doing-business figure {
    --bs-aspect-ratio: 59.85%;
}

.ecosystem-overview .btn {
    width: max-content !important;
    margin-top: 40px;
}

.ecosystem-map .media-centre-tabs {
    padding-block: 80px;
}

@media (max-width: 767.98px) {
    .ecosystem-map .media-centre-tabs {
        padding-block: 40px;
    }
}

.ecosystem-map .tabs-wrapper {
    margin-bottom: 58px;
}

@media (max-width: 767.98px) {
    .ecosystem-map .tabs-wrapper {
        margin-bottom: 30px;
    }
}

.ecosystem-map .tab-content .tab-pane {
    display: none;
}

    .ecosystem-map .tab-content .tab-pane.active {
        display: block;
    }

.ecosystem-map .country-list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 32px 0px 24px 32px;
    s gap: 16px;
    width: 100%;
    max-width: 304px;
    height: 604px;
    background: rgba(236, 231, 240, 0.5);
    border-radius: 12px;
    margin-bottom: 15px;
}

@media (max-width: 991.98px) {
    .ecosystem-map .country-list {
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
}

@media (max-width: 767.98px) {
    .ecosystem-map .country-list {
        height: auto;
        padding: 24px 20px;
    }
}

@media (min-width: 992px) and (max-width: 1400px) {
    .ecosystem-map .country-list {
        padding: 15px !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
    }
}

.ecosystem-map .world-map {
    width: 100%;
    min-height: 300px;
    padding: 20px 0;
}

@media (max-width: 767.98px) {
    .ecosystem-map .world-map {
        min-height: 250px;
        padding: 15px 0;
    }
}

.ecosystem-map .world-map figure {
    width: 100%;
    margin: 0;
}

    .ecosystem-map .world-map figure img {
        width: 100%;
        height: auto;
        max-width: 100%;
    }

.ecosystem-map h4 {
    font-size: 20px;
    font-weight: 400;
    color: var(--primary-accent);
}

@media (max-width: 767.98px) {
    .ecosystem-map h4 {
        font-size: 18px;
    }
}

@media (min-width: 992px) and (max-width: 1400px) {
    .ecosystem-map h4 {
        font-size: 15px !important;
    }
}

.ecosystem-map ul {
    overflow-y: auto;
    width: 100%;
    padding-inline-end: 15px;
}

    .ecosystem-map ul li,
    .ecosystem-map ul a {
        font-size: 20px;
        font-weight: 500;
        color: var(--text-muted);
        margin-bottom: 12px;
    }

@media (max-width: 767.98px) {
    .ecosystem-map ul {
        height: auto;
    }

        .ecosystem-map ul li,
        .ecosystem-map ul a {
            font-size: 16px;
        }
}

@media (min-width: 992px) and (max-width: 1400px) {
    .ecosystem-map ul {
        height: 200px !important;
    }

        .ecosystem-map ul li,
        .ecosystem-map ul a {
            font-size: 14px !important;
        }
}

.ecosystem-organizations .organization-wrapper {
    margin-bottom: 18px;
}

@media (max-width: 767.98px) {
    .ecosystem-organizations .organization-wrapper {
        margin-bottom: 15px;
    }
}

.ecosystem-organizations .organization-wrapper figure {
    text-align: center;
    padding-bottom: 0;
    margin-bottom: 0;
    --bs-aspect-ratio: 49.4%;
    width: 100%;
    max-width: 80%;
    margin-inline: auto;
}

    .ecosystem-organizations .organization-wrapper figure img {
        object-fit: contain;
    }

    .ecosystem-organizations .organization-wrapper figure.img-lg {
        max-width: 38%;
    }

@media (max-width: 767.98px) {
    .ecosystem-organizations .organization-wrapper figure.img-lg {
        max-width: 90%;
    }
}

.ecosystem-organizations .organization-wrapper figure.img-lg img {
    transform: scale(1.4);
}

@media (max-width: 991.98px) {
    .ecosystem-organizations .organization-wrapper figure.img-lg img {
        transform: none;
    }
}

.ecosystem-organizations .organization-wrapper.card {
    padding: 20px 24px;
    background: var(--surface-3);
    border-radius: 8px;
    border: 0;
    text-align: center;
    height: 122px;
}

    .ecosystem-organizations .organization-wrapper.card h4 {
        margin-bottom: 8px;
    }

@media (max-width: 1399.98px) {
    .ecosystem-organizations .organization-wrapper.card {
        height: auto !important;
    }
}

@media (max-width: 767.98px) {
    .ecosystem-organizations .organization-wrapper.card.w-50 {
        width: 100% !important;
    }
}

.ecosystem-organizations .organization-wrapper.card p {
    opacity: 0.75;
    color: var(--text);
    line-height: 25px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.ecosystem-organizations .organization-wrapper.content h4,
.ecosystem-organizations .organization-wrapper.content h5,
.ecosystem-organizations .organization-wrapper.content p {
    text-align: center;
}

.ecosystem-organizations .organization-wrapper.content h4 {
    margin-bottom: 24px;
}

.ecosystem-organizations .organization-wrapper.content h5 {
    margin-bottom: 12px;
}

.inner-banner.large.has-image .success-leaders #banner-img {
    display: block;
    width: 100%;
    max-height: 423px;
    object-fit: cover;
}

.inner-banner.large.has-image .success-leaders .swiper {
    display: none;
}

.success-leaders #banner-img {
    display: none;
}

.success-leaders .swiper {
    width: 100%;
    padding: 80px 0;
}

.success-leaders .swiper-slide {
    width: 260px;
    border-radius: 0;
    overflow: hidden;
    transition: transform 0.8s ease-in-out;
}

@media (min-width: 524px) {
    .success-leaders .swiper-slide {
        height: 320px;
    }
}

@media (min-width: 1600px) {
    .success-leaders .swiper-slide {
        height: 420px;
    }
}

.success-leaders .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.success-leaders .swiper-slide.prevSlide1 {
    clip-path: polygon(0 9%, 100% 14%, 100% 88%, 0% 92%);
}

.success-leaders .swiper-slide.prevSlide2 {
    clip-path: polygon(100% 9%, 100% 0%, 100% 0%, 100% 92%, 0% 100%, 100% 80%, 0% 100%, 0% 0%, 43% 4%);
}

.success-leaders .swiper-slide.middle {
    clip-path: polygon(100% 14%, 100% 88%, 0 88%, 0% 14%);
}

.success-leaders .swiper-slide.nextSlide1 {
    clip-path: polygon(100% 9%, 100% 90%, 0% 88%, 0 14%);
}

.success-leaders .swiper-slide.nextSlide2 {
    clip-path: polygon(80% 2%, 100% 0%, 100% 49%, 100% 100%, 12% 90%, 100% 94%, 0% 90%, 0% 9%, 32% 7%);
}

.ecosystem-trigger-map ul.nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 72px;
    overflow: auto;
    cursor: grab;
    -ms-overflow-style: none;
    scrollbar-width: none;
    margin-bottom: 58px !important;
    justify-content: flex-start;
    border: 0;
}

@media only screen and (max-width: 767.98px) {
    .ecosystem-trigger-map ul.nav {
        overflow: auto;
        gap: 16px;
        flex-wrap: nowrap;
        margin-bottom: 20px !important;
    }
}

.ecosystem-trigger-map ul.nav button.nav-link {
    border: 0;
    padding: 0;
    font-size: 16px;
    font-weight: 400;
    color: var(--dark-grey);
    border-bottom: 3px solid transparent;
    transition: all 0.3s ease-in-out;
    white-space: nowrap;
}

    .ecosystem-trigger-map ul.nav button.nav-link.active {
        border-bottom: 3px solid var(--violet);
        color: var(--primary-accent);
    }

@media only screen and (max-width: 767.98px) {
    .ecosystem-trigger-map .tab-content {
        padding: 0 !important;
        border: 0 !important;
    }
}

.ecosystem-trigger-map .tab-pane {
    padding: 0;
    border: 0;
    border-radius: 0;
}

@media only screen and (max-width: 767.98px) {
    .ecosystem-trigger-map .tab-pane {
        padding: 0 !important;
        border: 0 !important;
    }
}

.ecosystem-trigger-map .country-list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 32px 32px 24px;
    gap: 16px;
    width: 100%;
    max-width: 304px;
    height: 604px;
    background: rgba(236, 231, 240, 0.5);
    border-radius: 12px;
    margin-bottom: 15px;
}

@media only screen and (max-width: 767.98px) {
    .ecosystem-trigger-map .country-list {
        width: 100%;
        max-width: 100%;
        height: auto;
    }
}

.ecosystem-trigger-map .country-list h4 {
    font-size: 20px;
    font-size: clamp(12px, 10.5714285714px + 0.4464285714vw, 14px);
    font-weight: 400;
    color: var(--primary-accent);
}

@media (min-width: 768px) {
    .ecosystem-trigger-map .country-list h4 {
        font-size: clamp(14px, 14px + 0vw, 14px);
    }
}

@media (min-width: 1200px) {
    .ecosystem-trigger-map .country-list h4 {
        font-size: clamp(14px, 4px + 0.8333333333vw, 20px);
    }
}

.ecosystem-trigger-map .country-list ul {
    overflow-y: auto;
    height: 300px;
    padding-inline-end: 15px;
}

@media only screen and (max-width: 767.98px) {
    .ecosystem-trigger-map .country-list ul {
        height: auto;
    }
}

.ecosystem-trigger-map .country-list ul li {
    font-size: 20px;
    font-size: clamp(12px, 10.5714285714px + 0.4464285714vw, 14px);
    font-weight: 500;
    color: var(--text-muted);
    margin-bottom: 12px;
}

@media (min-width: 768px) {
    .ecosystem-trigger-map .country-list ul li {
        font-size: clamp(14px, 14px + 0vw, 14px);
    }
}

@media (min-width: 1200px) {
    .ecosystem-trigger-map .country-list ul li {
        font-size: clamp(14px, 4px + 0.8333333333vw, 20px);
    }
}

.ecosystem-trigger-map .country-list ul li a {
    font-size: 20px;
    font-size: clamp(12px, 10.5714285714px + 0.4464285714vw, 14px);
    font-weight: 500;
    color: var(--text-muted);
    margin-bottom: 12px;
}

@media (min-width: 768px) {
    .ecosystem-trigger-map .country-list ul li a {
        font-size: clamp(14px, 14px + 0vw, 14px);
    }
}

@media (min-width: 1200px) {
    .ecosystem-trigger-map .country-list ul li a {
        font-size: clamp(14px, 4px + 0.8333333333vw, 20px);
    }
}

.ecosystem-trigger-map .world-map {
    width: 100%;
    min-height: 300px;
    height: 100%;
    padding: 20px 0;
}

    .ecosystem-trigger-map .world-map figure {
        width: 100%;
        height: 100%;
        margin: 0;
    }

        .ecosystem-trigger-map .world-map figure svg {
            width: 100%;
            height: 100%;
            max-width: 100%;
            cursor: pointer;
        }

.gallery-container {
    height: 100%;
    row-gap: 74px;
    column-gap: 24px;
}

@media (max-width: 767.98px) {
    .gallery-container {
        row-gap: 24px;
    }
}

.gallery-wrapper {
    width: calc((100% - 48px) / 3);
}

@media (max-width: 1399.98px) {
    .gallery-wrapper {
        /* 2 per row below 1400 (1 column-gap) */
        width: calc((100% - 24px) / 2);
    }
}

@media (max-width: 767.98px) {
    .gallery-wrapper {
        width: 100% !important;
    }
}

.gallery-item {
    position: relative;
    width: 100%;
    height: 300px;
    background-color: var(--surface-2);
    border-radius: 16px;
    margin-bottom: 24px;
    isolation: isolate;
}

@media (max-width: 767.98px) {
    .gallery-item {
        width: 100% !important;
    }
}

.gallery-item::after {
    content: "";
    position: absolute;
    display: inline-block;
    width: 100%;
    height: 100%;
    background: url(../../assets/images/echoes-background.jpg);
    background-position: right;
    background-size: 80% 100%;
    background-repeat: no-repeat;
    border-radius: 0 16px 16px 0;
}

/* Hide the card background effect for video testimonials flagged with HideBackgroundEffect. */
.video-gallery .gallery-item:not(.has-bg-effect)::after {
    display: none;
}

.gallery-item a {
    width: 100%;
    height: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    z-index: 9;
}

    .gallery-item a img {
        object-fit: cover;
        height: 100%;
    }

.gallery-item-details h5 {
    margin-bottom: 12px;
}

.gallery-item-details p {
    margin-bottom: 24px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 999;
}

/* Read-more (view details) offcanvas: 40% of the page, responsive */
#videoTestimonialsViewModal {
    width: 837px;
}

@media (max-width: 1199.98px) {
    #videoTestimonialsViewModal {
        width: 60%;
    }
}

@media (max-width: 767.98px) {
    #videoTestimonialsViewModal {
        width: 100%;
    }
}

#videoTestimonialsViewModal .gallery-wrapper {
    width: 100%;
}

#videoTestimonialsViewModal .gallery-item .btn-close {
    position: absolute;
    top: 12px;
    inset-inline-end: 12px;
    z-index: 10;
    border: 1px solid var(--secondary);
    padding: 16px;
    border-radius: 50%;
    background: none;
    background-color: var(--surface);
    opacity: 1;
    display: flex;
    align-items: center;
}

    #videoTestimonialsViewModal .gallery-item .btn-close::after {
        content: "";
        display: inline-block;
        background-color: var(--violet);
        mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");
        background-image: none;
        mask-repeat: no-repeat;
        mask-size: 12px;
        mask-position: center center;
        width: 100%;
        height: 100%;
    }

    #videoTestimonialsViewModal .gallery-item .btn-close:hover {
        background-color: var(--violet);
    }

        #videoTestimonialsViewModal .gallery-item .btn-close:hover::after {
            background-color: var(--surface);
        }

#videoTestimonialsViewModal .gallery-item {
    height: auto;
    aspect-ratio: 524 / 300;
    overflow: visible;
    border-radius: 16px;
}

#videoTestimonialsViewModal #videoTestimonialsViewModalImage {
    border-radius: 16px;
}

/* Video popup: show only the video (no modal chrome), rounded corners */
#videoTestimonialsVideoModal .modal-content {
    background: transparent;
    border: 0;
    position: relative;
}

#videoTestimonialsVideoModal .modal-body {
    padding: 0;
}

#videoTestimonialsVideoModal #video-container video,
#videoTestimonialsVideoModal #video-container iframe {
    display: block;
    width: 100%;
    border-radius: 16px;
}

/* Close button: inside the video box, top-right corner */
#videoTestimonialsVideoModal .modal-header {
    position: absolute;
    top: 0;
    inset-inline-end: 0;
    z-index: 2;
    padding: 0;
    border: 0;
}

    #videoTestimonialsVideoModal .modal-header .btn-close {
        margin: 12px;
        width: 36px;
        height: 36px;
        padding: 0;
        border-radius: 50%;
        opacity: 1;
        /* light-gray circle with a white X (override Bootstrap's dark X icon) */
        background: var(--secondary) url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center / 14px no-repeat;
    }

/* Center the video popup on the page; larger but responsive */
#videoTestimonialsVideoModal .modal-dialog {
    display: flex;
    align-items: center;
    min-height: calc(100% - var(--bs-modal-margin, 1rem) * 2);
    width: 90%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

/* Video showcase popup: same design as the testimonials video popup */
.video-showcase-carousel__modal .modal-content {
    background: transparent;
    border: 0;
    position: relative;
}

.video-showcase-carousel__modal .modal-body {
    padding: 0;
}

.video-showcase-carousel__modal .video-showcase-carousel__video-slot video,
.video-showcase-carousel__modal .video-showcase-carousel__video-slot iframe {
    display: block;
    width: 100%;
    border-radius: 16px;
}

/* Close button: inside the video box, top-right corner */
.video-showcase-carousel__modal .modal-header {
    position: absolute;
    top: 0;
    inset-inline-end: 0;
    z-index: 2;
    padding: 0;
    border: 0;
}

    .video-showcase-carousel__modal .modal-header .btn-close {
        margin: 12px;
        width: 36px;
        height: 36px;
        padding: 0;
        border-radius: 50%;
        opacity: 1;
        /* light-gray circle with a white X (override Bootstrap's dark X icon) */
        background: var(--secondary) url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center / 14px no-repeat;
    }

/* Center the video popup on the page; larger but responsive */
.video-showcase-carousel__modal .modal-dialog {
    display: flex;
    align-items: center;
    min-height: calc(100% - var(--bs-modal-margin, 1rem) * 2);
    width: 90%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

/* YouTube iframe: responsive 16:9 (overrides the fixed height="500" attribute) */
.video-showcase-carousel__modal .video-showcase-carousel__video-slot iframe {
    height: auto;
    aspect-ratio: 16 / 9;
}

#gallleryViewModal {
    width: 830px;
    height: 1080px;
}

    #gallleryViewModal .offcanvas-body {
        padding: 56px;
        position: relative;
    }

        #gallleryViewModal .offcanvas-body .gallery-wrapper {
            width: 100%;
        }

        #gallleryViewModal .offcanvas-body .gallery-item {
            width: 100%;
            height: 415px;
        }

        #gallleryViewModal .offcanvas-body .gallery-item-details h5 {
            color: var(--primary-accent);
        }

        #gallleryViewModal .offcanvas-body .gallery-item-details p {
            display: block !important;
        }

        #gallleryViewModal .offcanvas-body .btn-close {
            display: flex;
            flex-direction: row;
            align-items: center;
            padding: 0;
            width: 54px;
            height: 54px;
            background: var(--surface);
            border: 1px solid var(--secondary);
            border-radius: 100%;
            opacity: 1;
            position: absolute;
            z-index: 99;
            inset-inline-end: 80px;
            inset-block-start: 80px;
        }

            #gallleryViewModal .offcanvas-body .btn-close:hover {
                background-color: var(--violet);
            }

                #gallleryViewModal .offcanvas-body .btn-close:hover::after {
                    background-color: var(--surface);
                }

            #gallleryViewModal .offcanvas-body .btn-close::after {
                content: "";
                display: inline-block;
                background-color: var(--violet);
                mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");
                background-image: none;
                mask-repeat: no-repeat;
                mask-size: 12px;
                mask-position: center center;
                width: 100%;
                height: 100%;
            }

.career-opportunity .sub-title {
    margin-bottom: 20px;
}

.button-list li {
    display: flex;
    gap: 12px;
    align-items: baseline;
    margin-bottom: 20px;
}

    .button-list li i {
        color: var(--primary-accent);
        font-size: 16px;
    }

.button-list.list-career-opportunity {
    padding-inline-start: 30px;
}

    .button-list.list-career-opportunity li {
        position: relative;
    }

        .button-list.list-career-opportunity li::before {
            content: "";
            position: absolute;
            left: -30px;
            top: 15px;
            transform: translateY(-50%);
            width: 8px;
            height: 3px;
            background-color: var(--black);
        }

.card-list2 {
    height: 100% !important;
    border: 0 !important;
}

    .card-list2 .left-img {
        flex: 0 0 45% !important;
        gap: 24px;
    }

@media (max-width: 767.98px) {
    .card-list2 .left-img {
        flex: 0 0 0 !important;
        width: 100%;
    }
}

.card-list2 .left-img figure {
    border-radius: 16px;
    position: relative;
    height: 100%;
}

@media (max-width: 767.98px) {
    .card-list2 .left-img figure {
        height: 220px;
    }
}

.card-list2 .left-img figure img {
    position: relative;
    width: 100%;
    border-radius: 16px;
    height: 100%;
    object-fit: cover;
}

.card-list2 .left-img figure::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 16px;
    background: linear-gradient(175.17deg, var(--violet) -32.5%, rgba(61, 18, 107, 0) 33.51%), linear-gradient(152.43deg, rgba(61, 18, 107, 0) 35.31%, var(--violet) 140.4%);
}

.card-list2 .right-details {
    padding: 0px 32px 0px 0;
    max-height: 380px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 15px;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

    .card-list2 .right-details::-webkit-scrollbar {
        display: none;
    }

@media (max-width: 1560px) and (min-width: 1200px) {
    .card-list2 .right-details {
        max-height: 300px;
    }
}

@media (max-width: 767.98px) {
    .card-list2 .right-details {
        padding: 16px;
        max-height: none;
        overflow-y: visible;
    }
}

.card-list2 .right-details .card-title {
    position: sticky;
    top: 0;
    background-color: var(--surface-2);
    z-index: 1;
    padding-top: 32px;
    padding-bottom: 10px;
}

@media (max-width: 767.98px) {
    .card-list2 .right-details .card-title {
        padding-top: 15px;
    }
}

.card-list2 .right-details .button-list {
    padding-inline-start: 30px;
    position: relative;
}

    .card-list2 .right-details .button-list li {
        position: relative;
    }

        .card-list2 .right-details .button-list li::before {
            content: "";
            position: absolute;
            left: -30px;
            top: 15px;
            transform: translateY(-50%);
            width: 16px;
            height: 16px;
            background-color: var(--primary);
            border-radius: 50%;
        }

.card-list2 .card-body {
    padding: 0;
    gap: 24px;
    display: flex;
    min-height: 330px;
    height: 330px;
    max-height: 330px;
    background-color: var(--surface-2);
    border-radius: 16px;
    border-color: var(--border);
}

.career-opportunity-cards .card-list2 .card-body {
    min-height: 420px !important;
}

@media (max-width: 575.98px) {
    .card-list2 .card-body {
        flex-direction: column;
        height: auto;
        min-height: unset;
        max-height: none;
        gap: 0;
    }

    .card-list2 .left-img figure {
        height: auto;
        border-radius: 16px 16px 0 0;
    }

        .card-list2 .left-img figure img {
            position: static;
            height: auto;
            object-fit: contain;
            border-radius: 16px 16px 0 0;
        }

        .card-list2 .left-img figure::after {
            display: none;
        }
}

.card.work-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 40px 40px 48px;
    gap: 40px;
    background: radial-gradient(140.79% 433.23% at -5.36% -23.12%, rgba(255, 255, 255, 0) 0%, var(--surface-2) 100%), var(--surface) !important;
    border: 1px solid var(--border) !important;
    box-shadow: none !important;
}

    .card.work-card .card-title {
        display: inline-block;
    }

    .card.work-card .card-text {
        color: var(--text-muted);
    }

    .card.work-card .details {
        padding-block-start: 40px !important;
    }

.qfca-wrapper {
    position: relative;
    padding: 30px 0;
    padding-top: 0;
}

@media (max-width: 1199.98px) {
    .qfca-wrapper {
        padding: 0;
    }
}

.qfca-wrapper .letter {
    cursor: pointer;
    position: relative;
    display: inline-block;
    color: var(--secondary);
    background-clip: text;
    -webkit-background-clip: text;
    line-height: 0.9;
    text-transform: capitalize;
}

    .qfca-wrapper .letter::before {
        content: attr(data-key);
        position: absolute;
        inset: 0;
        background-size: cover;
        background-position: center;
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        opacity: 0;
        transition: opacity 0.6s ease;
        background-image: var(--letter-image);
    }

    .qfca-wrapper .letter:hover {
        color: transparent;
    }

        .qfca-wrapper .letter:hover::before {
            opacity: 1;
        }

.qfca-wrapper:has(.letter[data-key=f]:hover) .f .line {
    opacity: 1;
}

.qfca-letters {
    font-size: 400px;
    font-weight: 900;
    display: flex;
    gap: 0px;
    justify-content: center;
    align-items: center;
}

@media (min-width: 1200px) and (max-width: 1399.98px) {
    .qfca-letters {
        font-size: 350px;
    }
}

@media only screen and (max-width: 1599.98px) {
    .qfca-letters {
        font-size: 300px;
    }
}

@media (max-width: 1199.98px) {
    .qfca-letters {
        font-size: 200px;
    }
}

@media (max-width: 575.98px) {
    .qfca-letters {
        font-size: 100px;
        gap: 10px;
    }
}

.qfca-images {
    position: absolute;
    inset: 0;
    z-index: -1;
}

    .qfca-images img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        opacity: 0;
        transition: opacity 0.4s ease;
    }

.qfca-content {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
    margin-top: 90px;
    gap: 32px;
}

@media (max-width: 991.98px) {
    .qfca-content {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
}

@media (max-width: 575.98px) {
    .qfca-content {
        grid-template-columns: repeat(1, 1fr);
        gap: 20px;
    }
}

.qfca-content .item {
    position: relative;
}

    .qfca-content .item.active {
        border-bottom: 2px solid var(--violet);
    }

.qfca-content .line {
    display: block;
    height: 3px;
    width: 100%;
    opacity: 0;
    background: var(--purple);
    margin-top: 12px;
    transition: opacity 0.4s ease;
}

    .qfca-content .line.active {
        opacity: 1;
    }

.btn.more-btn {
    padding-inline: 0;
    color: var(--primary-accent);
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
}

    .btn.more-btn:hover {
        text-decoration: underline;
    }

@media (max-width: 767.98px) {
    .btn.more-btn {
        font-size: 14px !important;
    }
}

.btn.more-btn:focus, .btn.more-btn:active {
    border: 0 !important;
    color: var(--primary-accent) !important;
}

.btn.more-btn.show-more {
    text-decoration: none;
}

.btn.more-btn.read-more, .btn.more-btn.read-less {
    text-decoration: underline;
}

.read-more-group {
    position: relative;
}

    .read-more-group:has(.read-more-content.collapsed) {
        padding-bottom: 1.8em;
    }

    .read-more-group .btn.more-btn.read-more {
        position: absolute;
        bottom: 0.3em;
        inset-inline-end: 0;
        background-color: var(--surface);
        padding-inline-start: 12px;
    }

    .read-more-group .read-more-content:not(.collapsed) {
        display: inline;
        overflow: visible;
    }

        .read-more-group .read-more-content:not(.collapsed) > *:last-child {
            display: inline;
            margin-bottom: 0;
        }

    .read-more-group .btn.more-btn.read-less {
        display: inline;
        padding-inline-start: 4px;
    }


.read-more-content {
    display: none;
}

    .read-more-content.collapsed {
        display: block;
    }

.read-more-content {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    transition: all 0.3s ease;
}

    .read-more-content.collapsed {
        -webkit-line-clamp: 10;
    }

    .read-more-content.collapsed {
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 10;
        -webkit-box-orient: vertical;
    }

.all-in-one-text-media-block-section .tmb-headline {
    color: var(--Violet-violet-500, var(--primary-accent));
    font-family: var(--typography-font-family-primary, "Noto Sans", sans-serif);
    font-size: var(--typography-font-size-font-size-40, 40px);
    font-style: normal;
    font-weight: 500;
    line-height: var(--typography-line-height-line-height-40, 48px);
    letter-spacing: var(--typography-letter-spacing-letter-spacing-2, -0.32px);
}

@media (max-width: 767.98px) {
    .all-in-one-text-media-block-section .tmb-headline {
        font-size: 30px;
        line-height: 38px;
    }
}

/* All-in-one text media block: full rich body clipped to ~12em;
   JS drives max-height directly via inline style for reliable cross-browser animation. */
.all-in-one-text-media-block-section .read-more-clip {
    position: relative;
    overflow: hidden;
    max-height: 16em;
    transition: max-height 0.45s ease;
}

/* White fade gradient at the bottom of the collapsed clip. */
.all-in-one-text-media-block-section .read-more-fade {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4em;
    background: linear-gradient(to bottom, transparent, var(--surface));
    pointer-events: none;
    transition: opacity 0.3s ease;
}

/* Fade the gradient out once expanded. */
.all-in-one-text-media-block-section .read-more-clip.is-open .read-more-fade {
    opacity: 0;
}

/* The body flows naturally inside the clip (override the shared clamp rules). */
.all-in-one-text-media-block-section .read-more-content {
    display: block !important;
    max-height: none !important;
    overflow: visible !important;
    -webkit-line-clamp: unset !important;
}

/* Toggle button, below the box. */
.all-in-one-text-media-block-section .read-more-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 12px;
    padding: 0;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--violet, var(--primary-accent));
    font-size: 16px;
    font-weight: 500;
}

    /* Keep the toggle visible on hover/focus (don't let .btn hover styles hide it). */
    .all-in-one-text-media-block-section .read-more-toggle:hover,
    .all-in-one-text-media-block-section .read-more-toggle:focus,
    .all-in-one-text-media-block-section .read-more-toggle:active {
        color: var(--violet, var(--primary-accent));
        background: none;
        opacity: 1;
    }

    .all-in-one-text-media-block-section .read-more-toggle .rm-arrow {
        display: inline-flex;
        align-items: center;
        transition: transform 0.35s ease;
    }

    .all-in-one-text-media-block-section .read-more-toggle[aria-expanded="true"] .rm-arrow {
        transform: rotate(180deg);
    }

/* When the body fits the box, no read-more is needed — show it all, no clip/toggle. */
.all-in-one-text-media-block-section .read-more-group.rm-fits .read-more-clip {
    max-height: none;
}

.all-in-one-text-media-block-section .read-more-group.rm-fits .read-more-fade,
.all-in-one-text-media-block-section .read-more-group.rm-fits .read-more-toggle {
    display: none;
}

.discover .card-list {
    background: var(--surface-2) !important;
    border-radius: 24px;
    border-color: var(--border-color);
    height: auto !important;
    overflow: hidden;
}

    .discover .card-list:hover {
        box-shadow: none !important;
    }

    .discover .card-list .card-body {
        display: grid;
        grid-template-columns: 300px 1fr;
        padding: 0 !important;
        gap: 0;
        overflow: hidden;
        min-height: 0;
        height: auto !important;
        align-items: stretch;
    }

@media (max-width: 991.98px) {
    .discover .card-list .card-body {
        grid-template-columns: 180px 1fr;
    }
}

@media (max-width: 575.98px) {
    .discover .card-list .card-body {
        grid-template-columns: 1fr;
    }
}

.discover .card-list .card-body figure {
    grid-column: 1;
    grid-row: 1;
    margin: 0;
    min-width: 300px;
    max-height: 300px;
    width: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 24px 0 0 24px;
    display: block;
    overflow: hidden;
    flex-shrink: 0;
}

@media (max-width: 575.98px) {
    .discover .card-list .card-body figure {
        border-radius: 24px 24px 0 0;
        width: 100%;
    }
}

.discover .card-list .card-body figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    mask-image: none;
    mask-repeat: unset;
    padding: 20px;
    border-radius: 15%;
}

.discover .card-list .card-body .card-content {
    grid-column: 2;
    padding: 24px;
    display: flex;
    padding: 7%;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
}

@media (max-width: 991.98px) {
    .discover .card-list .card-body .card-content {
        padding: 16px;
    }
}

@media (max-width: 575.98px) {
    .discover .card-list .card-body .card-content {
        grid-column: 1;
        padding: 16px;
    }
}

.discover .card-list .card-body h5 {
    font-weight: 500;
    line-height: 32px;
    color: var(--primary-accent) !important;
    margin: 0;
}

.discover .card-list .card-body p {
    grid-column: unset;
    grid-row: unset;
    line-height: 25px;
    color: var(--text-muted) !important;
    overflow: hidden;
    transition: all 0.3s ease;
    min-height: 0;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@media (max-width: 575.98px) {
    .discover .card-list .card-body p {
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}

@media only screen and (min-width: 1600px) {
    .discover .card-list .card-body p {
        min-height: 110px;
    }
}

@media (max-width: 575.98px) {
    .discover .card-list .card-body p {
        grid-column: 1;
    }
}

.discover .card-list .card-body p a {
    font-style: normal;
    font-weight: 500;
    color: var(--primary-accent) !important;
    opacity: 0;
    transition: all 0.5s ease;
    text-decoration: underline;
    margin-block: 20px;
}

@media (max-width: 767.98px) {
    .discover .card-list .card-body {
        padding: 15px !important;
        column-gap: 20px;
    }

        .discover .card-list .card-body h5 {
            font-size: 18px;
        }

        .discover .card-list .card-body p {
            font-size: 15px;
            line-height: 23px;
            line-break: anywhere;
        }

            .discover .card-list .card-body p a {
                margin-block: 5px;
            }
}

.discover .col-md-4.col-sm-6:has(.card-list) {
    width: 50%;
}

@media (max-width: 575.98px) {
    .discover .col-md-4.col-sm-6:has(.card-list) {
        width: 100% !important;
    }
}

.discover-new .card {
    border-radius: 16px;
}

.discover-new .card-list {
    height: 290px !important;
}

    .discover-new .card-list .card-text {
        width: calc(100% - 24px);
        overflow-y: auto;
        font-size: 18px;
    }

.discover-new .card-body {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

    .discover-new .card-body .more-btn {
        text-decoration: none;
        margin-top: auto;
    }

        .discover-new .card-body .more-btn .more-btn-inner {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            position: relative;
            z-index: 2;
        }

        .discover-new .card-body .more-btn .more-btn-text-wrap {
            display: inline-flex;
            flex-direction: column;
        }

        .discover-new .card-body .more-btn .more-btn-arrow {
            display: inline-block;
            width: 1em;
            height: 1em;
            flex-shrink: 0;
            background-color: var(--violet) !important;
            -webkit-mask-image: url('/_QFC_Assets/assets/images/icons/double-arrow-right.svg');
            mask-image: url('/_QFC_Assets/assets/images/icons/double-arrow-right.svg');
            -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
            -webkit-mask-size: contain;
            mask-size: contain;
            -webkit-mask-position: center;
            mask-position: center;
            transition: opacity 0.3s ease;
        }

        .discover-new .card-body .more-btn .more-btn-inner:hover .more-btn-arrow {
            opacity: 0;
        }

        .discover-new .card-body .more-btn .more-btn-line {
            width: 100%;
            height: 0;
            background-color: var(--violet);
            transition: height 0.3s ease;
        }

        .discover-new .card-body .more-btn .more-btn-inner:hover .more-btn-line {
            height: 1px;
        }

@media (min-width: 576px) and (max-width: 1199.98px) {
    .discover-new .card-text {
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}

.awards {
    overflow-x: clip;
    /* Opt out of the global `main > section { content-visibility: auto }` perf rule:
       its paint containment clips the swiper pagination/arrows that sit outside the
       section box (e.g. the negative-margin pagination). */
    content-visibility: visible;
}

@media (max-width: 768px) {
    .awards {
        overflow-x: visible;
    }

        .awards .swiper .swiper-pagination {
            margin-bottom: -92px !important;
        }
}




.links {
    overflow-x: hidden;
}

    .links .card .icon-box {
        width: 114px;
        height: 114px;
    }

    .links .card .arrow-icon {
        display: none;
    }

    .links .card:hover {
        outline-color: var(--violet) !important;
    }

        .links .card:hover img {
            filter: none !important;
        }

        .links .card:hover a {
            color: inherit !important;
        }

    .links .cardSwiper.swiper {
        overflow-y: visible !important;
    }

        .links .cardSwiper.swiper .swiper-slide {
            width: 400px !important;
        }

        .links .cardSwiper.swiper .card-journey:hover img {
            scale: 1.1;
        }

    .links .swiper-pagination {
        top: 140px !important;
    }

.start-business .setup {
    position: relative;
    overflow: hidden;
    background: linear-gradient(298.1deg, var(--purple) 3.27%, var(--violet) 125.83%);
    padding: 6rem 8rem 6rem 5rem;
}

    .start-business .setup::before {
        content: "";
        position: absolute;
        inset: 0;
        background: url(../../assets/images/icons/stat-bg.svg) no-repeat bottom right;
        background-size: cover;
        pointer-events: none;
    }

html[dir=rtl] .start-business .setup::before {
    transform: scaleX(-1);
}

.start-business .setup .btn:hover {
    background: var(--violet);
    color: var(--on-primary);
}

.start-business .setup h4, .start-business .setup p, .start-business .setup a {
    position: relative;
    z-index: 1;
}

.border-cards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 15px;
}

    .border-cards .event-details {
        border: 1px solid var(--surface-3);
        padding: 20px;
        border-radius: 16px;
        transition: all 0.3s ease-in-out;
        background: var(--surface);
    }

        .border-cards .event-details:hover {
            border-color: #a692bb;
            box-shadow: 0px 4px 16px rgba(240, 240, 240, 0.5);
        }

            .border-cards .event-details:hover a {
                color: var(--primary-accent) !important;
            }

@media (min-width: 1400px) {
    .custom-container {
        margin-left: calc((100% - 1500px) / 2);
        max-width: 100%;
    }
}

.organizations .sticky-side {
    position: sticky;
    top: 15%;
    align-self: flex-start;
    transition: all 0.3s ease-in-out;
}

@media (max-width: 991.98px) {
    .organizations .sticky-side {
        position: relative;
        top: unset;
    }
}

.organizations .card {
    background: var(--surface);
    border-radius: 16px;
    border: 0;
    margin: 2px;
    border: 1px solid var(--surface-3);
    box-shadow: 0px 4px 16px rgba(240, 240, 240, 0.5);
    border-left: 0;
}

    .organizations .card .card-body {
        padding: 0;
    }

    .organizations .card.card-journey {
        transition: all 0.5s ease-in-out;
        position: sticky;
        top: 20%;
    }

        .organizations .card.card-journey a {
            color: var(--text);
            font-size: 24px;
        }

        .organizations .card.card-journey p,
        .organizations .card.card-journey ul li {
            font-size: 16px;
        }

        .organizations .card.card-journey ul {
            padding-inline: 30px;
        }

            .organizations .card.card-journey ul li {
                margin-bottom: 8px;
                list-style-type: disc;
            }

        .organizations .card.card-journey .details {
            padding-block-start: 1rem;
        }

@media (max-width: 991.98px) {
    .organizations .card.card-journey {
        position: relative;
        top: unset;
    }

        .organizations .card.card-journey a {
            font-size: 20px;
        }

        .organizations .card.card-journey p,
        .organizations .card.card-journey ul li {
            font-size: 15px;
        }
}

@media (max-width: 991.98px) {
    .organizations .card.card-journey:first-child {
        margin-top: 3rem;
    }
}

.organizations .card .icon-box {
    min-height: 272px;
    min-width: 282px;
    max-width: 282px;
    background: #ece8f0;
    border-radius: 8px;
    padding: 2rem;
    margin-inline-end: 25px;
    justify-content: center;
}

@media (max-width: 400px) {
    .organizations .card .icon-box {
        min-width: 100%;
    }
}

.single-slider .slide-item figure img,
.single-slider .swiper-slide figure img {
    border-radius: 16px;
    height: 569px;
    height: clamp(200px, 200px + 0vw, 200px);
    object-fit: cover;
    object-position: center center;
    width: 100%;
}

@media (min-width: 768px) {
    .single-slider .slide-item figure img,
    .single-slider .swiper-slide figure img {
        height: clamp(200px, 200px + 0vw, 200px);
    }
}

@media (min-width: 1200px) {
    .single-slider .slide-item figure img,
    .single-slider .swiper-slide figure img {
        height: clamp(200px, -415px + 51.25vw, 569px);
    }
}

.single-slider .slide-item h2,
.single-slider .swiper-slide h2 {
    font-size: 32px;
    font-size: clamp(18px, 16.5714285714px + 0.4464285714vw, 20px);
}

@media (min-width: 768px) {
    .single-slider .slide-item h2,
    .single-slider .swiper-slide h2 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .single-slider .slide-item h2,
    .single-slider .swiper-slide h2 {
        font-size: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.single-slider .slide-item p,
.single-slider .swiper-slide p {
    font-size: 18px;
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .single-slider .slide-item p,
    .single-slider .swiper-slide p {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .single-slider .slide-item p,
    .single-slider .swiper-slide p {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

.single-slider .slide-item ul,
.single-slider .swiper-slide ul {
    padding-inline: 30px;
}

    .single-slider .slide-item ul li,
    .single-slider .swiper-slide ul li {
        font-size: 18px;
        list-style-type: disc;
        margin-bottom: 8px;
    }

.single-slider .slide-item .p-content,
.single-slider .swiper-slide .p-content {
    padding-inline: 4rem 2rem;
    max-height: 600px;
    height: clamp(250px, 250px + 0vw, 250px);
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    /* `safe` keeps short content centered but falls back to top-alignment when the body
       overflows, so the title can't be pushed above the scroll area and clipped */
    justify-content: safe center;
}

@media (min-width: 768px) {
    .single-slider .slide-item .p-content,
    .single-slider .swiper-slide .p-content {
        height: clamp(250px, 161.1111111111px + 11.5740740741vw, 300px);
    }
}

@media (min-width: 1200px) {
    .single-slider .slide-item .p-content,
    .single-slider .swiper-slide .p-content {
        height: clamp(300px, -200px + 41.6666666667vw, 600px);
    }
}

@media (max-width: 767.98px) {
    .single-slider .slide-item .p-content,
    .single-slider .swiper-slide .p-content {
        padding-inline: 0 !important;
        overflow: visible;
        display: block;
        height: fit-content;
    }
}

.single-slider .slide-item .more-btn,
.single-slider .swiper-slide .more-btn {
    font-size: 16px;
    font-weight: 500;
    text-decoration: underline;
    text-decoration-color: transparent;
    transition: text-decoration-color 0.3s ease;
}

.single-slider .slide-item .more-btn {
    font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
}

    .single-slider .slide-item .more-btn img,
    .single-slider .swiper-slide .more-btn img {
        transition: opacity 0.3s ease;
    }

    .single-slider .slide-item .more-btn:hover,
    .single-slider .swiper-slide .more-btn:hover {
        text-decoration-color: currentColor;
    }

        .single-slider .slide-item .more-btn:hover img,
        .single-slider .swiper-slide .more-btn:hover img {
            opacity: 0;
        }

.single-slider .slide-item .btn.btn-transparent,
.single-slider .swiper-slide .btn.btn-transparent {
    border: 1px solid var(--secondary);
    color: var(--purple) !important;
    line-height: 1;
    background: var(--surface);
    border-radius: 72px;
    font-family: var(--primary-font);
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--on-primary);
    text-align: center;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    transition: none;
    margin-bottom: 20px;
}

    .single-slider .slide-item .btn.btn-transparent i,
    .single-slider .swiper-slide .btn.btn-transparent i {
        font-size: 9px;
        color: var(--on-primary);
        display: none;
        align-items: center;
    }

@media (max-width: 767.98px) {
    .single-slider .slide-item .btn.btn-transparent,
    .single-slider .swiper-slide .btn.btn-transparent {
        font-size: 12px !important;
    }
}

@media (min-width: 992px) and (max-width: 1400px) {
    .single-slider .slide-item .btn.btn-transparent,
    .single-slider .swiper-slide .btn.btn-transparent {
        font-size: 12px !important;
    }
}

.single-slider .slide-item .btn.btn-transparent span,
.single-slider .swiper-slide .btn.btn-transparent span {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: none;
    transform: none;
    transform: none !important;
}

    .single-slider .slide-item .btn.btn-transparent span i,
    .single-slider .swiper-slide .btn.btn-transparent span i {
        opacity: 1;
        transition: opacity 0.35s ease, transform 0.35s ease;
        display: none;
    }

    .single-slider .slide-item .btn.btn-transparent span i,
    .single-slider .swiper-slide .btn.btn-transparent span i {
        display: block !important;
    }

    .single-slider .slide-item .btn.btn-transparent span::before,
    .single-slider .swiper-slide .btn.btn-transparent span::before {
        display: none !important;
    }

.single-slider .slide-item .btn.btn-transparent:hover,
.single-slider .swiper-slide .btn.btn-transparent:hover {
    background: var(--violet) !important;
    color: var(--on-primary) !important;
    border-color: var(--violet) !important;
}

    .single-slider .slide-item .btn.btn-transparent:hover i,
    .single-slider .swiper-slide .btn.btn-transparent:hover i {
        color: var(--on-primary) !important;
        opacity: 1;
        transform: none;
    }

.single-slider .slide-item .btn.btn-transparent i,
.single-slider .swiper-slide .btn.btn-transparent i {
    color: var(--purple) !important;
    font-size: 18px;
}

html[dir=rtl] .single-slider .slide-item .btn.btn-transparent i::before,
html[dir=rtl] .single-slider .swiper-slide .btn.btn-transparent i::before {
    transform: scaleX(-1);
}

@media (max-width: 575.98px) {
    .single-slider .slide-item .btn.btn-transparent,
    .single-slider .swiper-slide .btn.btn-transparent {
        width: 295px !important;
        white-space: nowrap;
    }

        .single-slider .slide-item .btn.btn-transparent i,
        .single-slider .swiper-slide .btn.btn-transparent i {
            font-size: 14px;
        }
}

@media (max-width: 767.98px) {
    .single-slider .slide-item h2,
    .single-slider .swiper-slide h2 {
        font-size: 26px !important;
    }
}

.single-slider .slick-dots {
    display: flex;
    margin-block: 3rem 0;
}

    .single-slider .slick-dots li {
        display: flex;
        margin: 0;
        max-width: 100%;
        width: 100%;
    }

        .single-slider .slick-dots li:last-child button {
            border-top-right-radius: 16px;
            border-bottom-right-radius: 16px;
        }

        .single-slider .slick-dots li:first-child button {
            border-top-left-radius: 16px;
            border-bottom-left-radius: 16px;
        }

        .single-slider .slick-dots li button {
            font-size: 0;
            background-color: var(--border);
            height: 7px;
            border: 0;
            width: 100%;
        }

        .single-slider .slick-dots li.slick-active button {
            background-color: var(--violet);
            border-radius: 16px;
        }

.single-slider .slick-arrow {
    position: absolute;
    inset-inline-end: 0;
    top: -103px;
    width: 54px;
    height: 54px;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 100%;
    font-size: 0;
    border: 1px solid var(--purple);
}

    .single-slider .slick-arrow::after {
        font-family: bootstrap-icons !important;
        color: var(--purple);
        font-size: 1.25rem;
    }

    .single-slider .slick-arrow:hover {
        background: var(--violet);
    }

        .single-slider .slick-arrow:hover::after {
            color: var(--on-primary);
        }

@media (max-width: 767.98px) {
    .single-slider .slick-arrow {
        width: 40px;
        height: 40px;
        top: -59px;
    }
}

.single-slider .slick-arrow.slick-next::after {
    content: "\f285";
}

html[dir=rtl] .single-slider .slick-arrow.slick-next {
    transform: scaleX(-1);
}

.single-slider .slick-arrow.slick-prev {
    inset-inline-end: 65px;
}

html[dir=rtl] .single-slider .slick-arrow.slick-prev {
    transform: scaleX(-1);
}

.single-slider .slick-arrow.slick-prev::after {
    content: "\f284";
}

.single-slider .slick-arrow.slick-disabled {
    opacity: 0.35;
    cursor: auto;
    pointer-events: none;
}

.explore .slick-slide .slide-item,
.explore .slick-slide .swiper-slide,
.explore .swiper .slide-item,
.explore .swiper .swiper-slide {
    height: 100%;
    background-color: #ebebeb;
    border-radius: 16px;
    padding: 4rem;
}

@media (max-width: 991.98px) {
    .explore .slick-slide .slide-item,
    .explore .slick-slide .swiper-slide,
    .explore .swiper .slide-item,
    .explore .swiper .swiper-slide {
        padding: 2rem;
    }
}

.explore .slick-slide .slide-item .btn.btn-transparent,
.explore .slick-slide .swiper-slide .btn.btn-transparent,
.explore .swiper .slide-item .btn.btn-transparent,
.explore .swiper .swiper-slide .btn.btn-transparent {
    width: max-content !important;
    padding: 16px 24px 18px 32px !important;
    background: transparent;
}

.explore .slick-slide figure,
.explore .swiper figure {
    margin-bottom: 0;
}

    .explore .slick-slide figure img,
    .explore .swiper figure img {
        height: auto !important;
        aspect-ratio: 712/464;
        margin-bottom: 15px;
    }

.explore .slick-slide .p-content,
.explore .swiper .p-content {
    height: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

    .explore .slick-slide .p-content h2,
    .explore .swiper .p-content h2 {
        font-weight: 600 !important;
    }

.explore .slick-arrow {
    transform: rotate(90deg);
}

    .explore .slick-arrow.slick-next {
        right: -7.5%;
        top: 40%;
    }

    .explore .slick-arrow.slick-prev {
        right: -7.5%;
        top: 30%;
    }

.explore .slick-slider {
    max-height: 780px;
}

    .explore .slick-slider .slick-slide {
        position: relative;
    }

        .explore .slick-slider .slick-slide:not(.slick-active) {
            visibility: hidden;
        }

    .explore .slick-slider .slide-item {
        transition: 0.25s transform ease-in, 0.25s background ease-in;
    }

    .explore .slick-slider .slick-current {
        z-index: 3;
    }

        .explore .slick-slider .slick-current .slide-item {
            background: var(--surface-2);
            transform: translateY(0) scale(1);
        }

@keyframes moveup {
    0% {
        transform: translateY(-100px);
    }

    100% {
        transform: translateY(-200px);
    }
}

.explore .slick-slider .slick-slide-next.slick-active {
    z-index: 2;
}

    .explore .slick-slider .slick-slide-next.slick-active + .slick-slide-next {
        z-index: 1;
    }

        .explore .slick-slider .slick-slide-next.slick-active + .slick-slide-next .slide-item {
            background: var(--border);
            transform: translateY(-173%) scale(0.8);
        }

    .explore .slick-slider .slick-slide-next.slick-active .slide-item {
        transform: translateY(-86%) scale(0.9);
        background: #ebebeb;
    }

.explore .swiper {
    height: 590px;
}

@media (max-width: 767.98px) {
    .explore .swiper {
        height: 650px;
        padding-top: 50px;
        padding-bottom: 25px;
    }
}

.explore .swiper .swiper-slide .swiper-slide-shadow {
    background: var(--border);
}

.explore .swiper .swiper-slide.swiper-slide-next .swiper-slide-shadow, .explore .swiper .swiper-slide.swiper-slide-prev .swiper-slide-shadow {
    background: #ebebeb;
}

.explore .swiper .swiper-slide.swiper-slide-active {
    background-color: var(--surface-2);
}

.explore .swiper .swiper-slide.moving {
    animation: moveslide 5s forwards;
}

.explore .swiper .swiper-button-next,
.explore .swiper .swiper-button-prev {
    right: -8% !important;
    transform: rotate(90deg);
}

.explore .swiper .swiper-button-next {
    top: 55%;
}

.explore .swiper .swiper-button-prev {
    top: 45%;
}

@media (max-width: 991.98px) {
    .explore .swiper .swiper-button-next,
    .explore .swiper .swiper-button-prev {
        top: -30px !important;
        transform: rotate(0deg);
        width: 40px;
        height: 40px;
    }

    .explore .swiper .swiper-button-prev {
        right: 8% !important;
    }
}

.setup-slider.slick-slider,
.setup-slider .slick-list,
.setup-slider .slick-track,
.setup-slider .slick-slide,
.setup-slider .slide-item,
.setup-slider .slick-slide > div {
    height: 100%;
}

@media (max-width: 991.98px) {
    section.mt-5,
    section.my-5 {
        margin-top: 0 !important;
    }

    section.pt-5,
    section.py-5 {
        padding-top: 25px !important;
        padding-bottom: 25px !important;
    }

    .card.card-list.mt-5 {
        margin-top: 0 !important;
    }
}

@media (max-width: 767.98px) {
    .explore .section-title br,
    .explore .sub-title br {
        display: none;
    }

    .explore .explore-text {
        align-items: start !important;
    }

    .border-cards {
        grid-template-columns: repeat(1, 1fr);
    }
}

.about-us .video-container {
    border-radius: 16px;
}

    .about-us .video-container video {
        border-radius: 0;
        width: 100%;
        height: 100%;
    }

/*!
* Style Sheet for ""
* version: 1
* last modified:2023 By Applab
* author: Applab
* website: www.applab.qa
*/
.alert-primary {
    --bs-alert-color: var(--bs-primary-text);
    --bs-alert-bg: var(--bs-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-primary-border-subtle);
    --bs-alert-link-color: var(--bs-primary-text);
}

.alert-white {
    --bs-alert-color: var(--bs-white-text);
    --bs-alert-bg: var(--bs-white-bg-subtle);
    --bs-alert-border-color: var(--bs-white-border-subtle);
    --bs-alert-link-color: var(--bs-white-text);
}

.alert-black {
    --bs-alert-color: var(--bs-black-text);
    --bs-alert-bg: var(--bs-black-bg-subtle);
    --bs-alert-border-color: var(--bs-black-border-subtle);
    --bs-alert-link-color: var(--bs-black-text);
}

.alert-secondary {
    --bs-alert-color: var(--bs-secondary-text);
    --bs-alert-bg: var(--bs-secondary-bg-subtle);
    --bs-alert-border-color: var(--bs-secondary-border-subtle);
    --bs-alert-link-color: var(--bs-secondary-text);
}

.alert-light-primary {
    --bs-alert-color: var(--bs-light-primary-text);
    --bs-alert-bg: var(--bs-light-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-light-primary-border-subtle);
    --bs-alert-link-color: var(--bs-light-primary-text);
}

.alert-light-bg {
    --bs-alert-color: var(--bs-light-bg-text);
    --bs-alert-bg: var(--bs-light-bg-bg-subtle);
    --bs-alert-border-color: var(--bs-light-bg-border-subtle);
    --bs-alert-link-color: var(--bs-light-bg-text);
}

.alert-grey {
    --bs-alert-color: var(--bs-grey-text);
    --bs-alert-bg: var(--bs-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-grey-border-subtle);
    --bs-alert-link-color: var(--bs-grey-text);
}

.alert-purple {
    --bs-alert-color: var(--bs-purple-text);
    --bs-alert-bg: var(--bs-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-purple-border-subtle);
    --bs-alert-link-color: var(--bs-purple-text);
}

.alert-dark-purple {
    --bs-alert-color: var(--bs-dark-purple-text);
    --bs-alert-bg: var(--bs-dark-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-purple-border-subtle);
    --bs-alert-link-color: var(--bs-dark-purple-text);
}

.alert-violet {
    --bs-alert-color: var(--bs-violet-text);
    --bs-alert-bg: var(--bs-violet-bg-subtle);
    --bs-alert-border-color: var(--bs-violet-border-subtle);
    --bs-alert-link-color: var(--bs-violet-text);
}

.alert-dark-grey {
    --bs-alert-color: var(--bs-dark-grey-text);
    --bs-alert-bg: var(--bs-dark-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-grey-border-subtle);
    --bs-alert-link-color: var(--bs-dark-grey-text);
}

.alert-light-black {
    --bs-alert-color: var(--bs-light-black-text);
    --bs-alert-bg: var(--bs-light-black-bg-subtle);
    --bs-alert-border-color: var(--bs-light-black-border-subtle);
    --bs-alert-link-color: var(--bs-light-black-text);
}

.alert-border-color {
    --bs-alert-color: var(--bs-border-color-text);
    --bs-alert-bg: var(--bs-border-color-bg-subtle);
    --bs-alert-border-color: var(--bs-border-color-border-subtle);
    --bs-alert-link-color: var(--bs-border-color-text);
}

.alert-grey1 {
    --bs-alert-color: var(--bs-grey1-text);
    --bs-alert-bg: var(--bs-grey1-bg-subtle);
    --bs-alert-border-color: var(--bs-grey1-border-subtle);
    --bs-alert-link-color: var(--bs-grey1-text);
}

.alert-grey2 {
    --bs-alert-color: var(--bs-grey2-text);
    --bs-alert-bg: var(--bs-grey2-bg-subtle);
    --bs-alert-border-color: var(--bs-grey2-border-subtle);
    --bs-alert-link-color: var(--bs-grey2-text);
}

.alert-gray-color {
    --bs-alert-color: var(--bs-gray-color-text);
    --bs-alert-bg: var(--bs-gray-color-bg-subtle);
    --bs-alert-border-color: var(--bs-gray-color-border-subtle);
    --bs-alert-link-color: var(--bs-gray-color-text);
}

.alert-gray3 {
    --bs-alert-color: var(--bs-gray3-text);
    --bs-alert-bg: var(--bs-gray3-bg-subtle);
    --bs-alert-border-color: var(--bs-gray3-border-subtle);
    --bs-alert-link-color: var(--bs-gray3-text);
}

.alert-light-grey {
    --bs-alert-color: var(--bs-light-grey-text);
    --bs-alert-bg: var(--bs-light-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-light-grey-border-subtle);
    --bs-alert-link-color: var(--bs-light-grey-text);
}

.bg-primary {
    background: var(--primary) !important;
}

.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
    }

.btn-outline-primary {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary-accent);
}

    .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
        box-shadow: none;
        outline: none;
    }

.text-primary {
    color: var(--primary-accent) !important;
}

.bg-white {
    background: var(--surface) !important;
}

.btn-white {
    background: var(--surface);
    border-color: var(--on-primary);
}

    .btn-white:hover, .btn-white:focus, .btn-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
    }

.btn-outline-white {
    background: transparent;
    border-color: var(--on-primary);
    color: var(--on-primary);
}

    .btn-outline-white:hover, .btn-outline-white:focus, .btn-outline-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
        box-shadow: none;
        outline: none;
    }

.text-white {
    color: var(--on-primary) !important;
}

.bg-black {
    background: var(--black) !important;
}

.btn-black {
    background: var(--black);
    border-color: var(--black);
}

    .btn-black:hover, .btn-black:focus, .btn-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
    }

.btn-outline-black {
    background: transparent;
    border-color: var(--black);
    color: var(--text);
}

    .btn-outline-black:hover, .btn-outline-black:focus, .btn-outline-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
        box-shadow: none;
        outline: none;
    }

.text-black {
    color: var(--text) !important;
}

.bg-secondary {
    background: var(--text-muted) !important;
}

.btn-secondary {
    background: var(--text-muted);
    border-color: var(--text-muted);
}

    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
    }

.btn-outline-secondary {
    background: transparent;
    border-color: var(--text-muted);
    color: var(--text-muted);
}

    .btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
        box-shadow: none;
        outline: none;
    }

.text-secondary {
    color: var(--text-muted) !important;
}

.bg-light-primary {
    background: var(--light-primary) !important;
}

.btn-light-primary {
    background: var(--light-primary);
    border-color: var(--light-primary);
}

    .btn-light-primary:hover, .btn-light-primary:focus, .btn-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
    }

.btn-outline-light-primary {
    background: transparent;
    border-color: var(--light-primary);
    color: var(--light-primary);
}

    .btn-outline-light-primary:hover, .btn-outline-light-primary:focus, .btn-outline-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
        box-shadow: none;
        outline: none;
    }

.text-light-primary {
    color: var(--light-primary) !important;
}

.bg-light-bg {
    background: var(--light-bg) !important;
}

.btn-light-bg {
    background: var(--light-bg);
    border-color: var(--light-bg);
}

    .btn-light-bg:hover, .btn-light-bg:focus, .btn-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
    }

.btn-outline-light-bg {
    background: transparent;
    border-color: var(--light-bg);
    color: var(--light-bg);
}

    .btn-outline-light-bg:hover, .btn-outline-light-bg:focus, .btn-outline-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
        box-shadow: none;
        outline: none;
    }

.text-light-bg {
    color: var(--light-bg) !important;
}

.bg-grey {
    background: var(--grey) !important;
}

.btn-grey {
    background: var(--grey);
    border-color: var(--grey);
}

    .btn-grey:hover, .btn-grey:focus, .btn-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
    }

.btn-outline-grey {
    background: transparent;
    border-color: var(--grey);
    color: var(--grey);
}

    .btn-outline-grey:hover, .btn-outline-grey:focus, .btn-outline-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
        box-shadow: none;
        outline: none;
    }

.text-grey {
    color: var(--grey) !important;
}

.bg-purple {
    background: var(--purple) !important;
}

.btn-purple {
    background: var(--purple);
    border-color: var(--purple);
}

    .btn-purple:hover, .btn-purple:focus, .btn-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
    }

.btn-outline-purple {
    background: transparent;
    border-color: var(--purple);
    color: var(--purple);
}

    .btn-outline-purple:hover, .btn-outline-purple:focus, .btn-outline-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
        box-shadow: none;
        outline: none;
    }

.text-purple {
    color: var(--purple) !important;
}

.bg-dark-purple {
    background: var(--dark-purple) !important;
}

.btn-dark-purple {
    background: var(--dark-purple);
    border-color: var(--dark-purple);
}

    .btn-dark-purple:hover, .btn-dark-purple:focus, .btn-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
    }

.btn-outline-dark-purple {
    background: transparent;
    border-color: var(--dark-purple);
    color: var(--dark-purple);
}

    .btn-outline-dark-purple:hover, .btn-outline-dark-purple:focus, .btn-outline-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
        box-shadow: none;
        outline: none;
    }

.text-dark-purple {
    color: var(--dark-purple) !important;
}

.bg-violet {
    background: var(--violet) !important;
}

.btn-violet {
    background: var(--violet);
    border-color: var(--violet);
}

    .btn-violet:hover, .btn-violet:focus, .btn-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
    }

.btn-outline-violet {
    background: transparent;
    border-color: var(--violet);
    color: var(--primary-accent);
}

    .btn-outline-violet:hover, .btn-outline-violet:focus, .btn-outline-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
        box-shadow: none;
        outline: none;
    }

.text-violet {
    color: var(--primary-accent) !important;
}

.bg-dark-grey {
    background: var(--dark-grey) !important;
}

.btn-dark-grey {
    background: var(--dark-grey);
    border-color: var(--dark-grey);
}

    .btn-dark-grey:hover, .btn-dark-grey:focus, .btn-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
    }

.btn-outline-dark-grey {
    background: transparent;
    border-color: var(--dark-grey);
    color: var(--dark-grey);
}

    .btn-outline-dark-grey:hover, .btn-outline-dark-grey:focus, .btn-outline-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
        box-shadow: none;
        outline: none;
    }

.text-dark-grey {
    color: var(--dark-grey) !important;
}

.bg-light-black {
    background: var(--light-black) !important;
}

.btn-light-black {
    background: var(--light-black);
    border-color: var(--light-black);
}

    .btn-light-black:hover, .btn-light-black:focus, .btn-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
    }

.btn-outline-light-black {
    background: transparent;
    border-color: var(--light-black);
    color: var(--light-black);
}

    .btn-outline-light-black:hover, .btn-outline-light-black:focus, .btn-outline-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
        box-shadow: none;
        outline: none;
    }

.text-light-black {
    color: var(--light-black) !important;
}

.bg-border-color {
    background: var(--border-color) !important;
}

.btn-border-color {
    background: var(--border-color);
    border-color: var(--border-color);
}

    .btn-border-color:hover, .btn-border-color:focus, .btn-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
    }

.btn-outline-border-color {
    background: transparent;
    border-color: var(--border-color);
    color: var(--border-color);
}

    .btn-outline-border-color:hover, .btn-outline-border-color:focus, .btn-outline-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
        box-shadow: none;
        outline: none;
    }

.text-border-color {
    color: var(--border-color) !important;
}

.bg-grey1 {
    background: var(--grey1) !important;
}

.btn-grey1 {
    background: var(--grey1);
    border-color: var(--grey1);
}

    .btn-grey1:hover, .btn-grey1:focus, .btn-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
    }

.btn-outline-grey1 {
    background: transparent;
    border-color: var(--grey1);
    color: var(--grey1);
}

    .btn-outline-grey1:hover, .btn-outline-grey1:focus, .btn-outline-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
        box-shadow: none;
        outline: none;
    }

.text-grey1 {
    color: var(--grey1) !important;
}

.bg-grey2 {
    background: var(--grey2) !important;
}

.btn-grey2 {
    background: var(--grey2);
    border-color: var(--grey2);
}

    .btn-grey2:hover, .btn-grey2:focus, .btn-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
    }

.btn-outline-grey2 {
    background: transparent;
    border-color: var(--grey2);
    color: var(--grey2);
}

    .btn-outline-grey2:hover, .btn-outline-grey2:focus, .btn-outline-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
        box-shadow: none;
        outline: none;
    }

.text-grey2 {
    color: var(--grey2) !important;
}

.bg-gray-color {
    background: var(--gray-color) !important;
}

.btn-gray-color {
    background: var(--gray-color);
    border-color: var(--gray-color);
}

    .btn-gray-color:hover, .btn-gray-color:focus, .btn-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
    }

.btn-outline-gray-color {
    background: transparent;
    border-color: var(--gray-color);
    color: var(--gray-color);
}

    .btn-outline-gray-color:hover, .btn-outline-gray-color:focus, .btn-outline-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
        box-shadow: none;
        outline: none;
    }

.text-gray-color {
    color: var(--gray-color) !important;
}

.bg-gray3 {
    background: var(--gray3) !important;
}

.btn-gray3 {
    background: var(--gray3);
    border-color: var(--gray3);
}

    .btn-gray3:hover, .btn-gray3:focus, .btn-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
    }

.btn-outline-gray3 {
    background: transparent;
    border-color: var(--gray3);
    color: var(--gray3);
}

    .btn-outline-gray3:hover, .btn-outline-gray3:focus, .btn-outline-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
        box-shadow: none;
        outline: none;
    }

.text-gray3 {
    color: var(--gray3) !important;
}

.bg-light-grey {
    background: var(--light-grey) !important;
}

.btn-light-grey {
    background: var(--light-grey);
    border-color: var(--light-grey);
}

    .btn-light-grey:hover, .btn-light-grey:focus, .btn-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
    }

.btn-outline-light-grey {
    background: transparent;
    border-color: var(--light-grey);
    color: var(--light-grey);
}

    .btn-outline-light-grey:hover, .btn-outline-light-grey:focus, .btn-outline-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
        box-shadow: none;
        outline: none;
    }

.text-light-grey {
    color: var(--light-grey) !important;
}

.fs-56 {
    font-size: clamp(30px, 30px + 0vw, 30px);
}

@media (min-width: 768px) {
    .fs-56 {
        font-size: clamp(30px, 30px + 0vw, 30px);
    }
}

@media (min-width: 1200px) {
    .fs-56 {
        font-size: clamp(30px, -13.3333333333px + 3.6111111111vw, 56px);
    }
}

.fs-40 {
    font-size: clamp(18px, 13.7142857143px + 1.3392857143vw, 24px);
}

@media (min-width: 768px) {
    .fs-40 {
        font-size: clamp(24px, 24px + 0vw, 24px);
    }
}

@media (min-width: 1200px) {
    .fs-40 {
        font-size: clamp(24px, -2.6666666667px + 2.2222222222vw, 40px);
    }
}

.fs-38 {
    font-size: clamp(18px, 15.1428571429px + 0.8928571429vw, 22px);
}

@media (min-width: 768px) {
    .fs-38 {
        font-size: clamp(22px, 22px + 0vw, 22px);
    }
}

@media (min-width: 1200px) {
    .fs-38 {
        font-size: clamp(22px, -4.6666666667px + 2.2222222222vw, 38px);
    }
}

.fs-32 {
    font-size: clamp(18px, 16.5714285714px + 0.4464285714vw, 20px);
}

@media (min-width: 768px) {
    .fs-32 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .fs-32 {
        font-size: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.fs-28 {
    font-size: clamp(16px, 14.5714285714px + 0.4464285714vw, 18px);
}

@media (min-width: 768px) {
    .fs-28 {
        font-size: clamp(18px, 18px + 0vw, 18px);
    }
}

@media (min-width: 1200px) {
    .fs-28 {
        font-size: clamp(18px, 1.3333333333px + 1.3888888889vw, 28px);
    }
}

.fs-24 {
    font-size: clamp(16px, 16px + 0vw, 16px);
}

@media (min-width: 768px) {
    .fs-24 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-24 {
        font-size: clamp(16px, 2.6666666667px + 1.1111111111vw, 24px);
    }
}

.fs-22 {
    font-size: clamp(14px, 12.5714285714px + 0.4464285714vw, 16px);
}

@media (min-width: 768px) {
    .fs-22 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-22 {
        font-size: clamp(16px, 6px + 0.8333333333vw, 22px);
    }
}

.fs-20 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-20 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-20 {
        font-size: clamp(12px, -1.3333333333px + 1.1111111111vw, 20px);
    }
}

.fs-18 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-18 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-18 {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

.fs-16 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-16 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-16 {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

.fs-15 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-15 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-15 {
        font-size: clamp(12px, 7px + 0.4166666667vw, 15px);
    }
}

.fs-14 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-14 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-14 {
        font-size: clamp(10px, 3.3333333333px + 0.5555555556vw, 14px);
    }
}

.fs-12 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-12 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-12 {
        font-size: clamp(10px, 6.6666666667px + 0.2777777778vw, 12px);
    }
}

.section-title {
    text-align: start;
}

@media (max-width: 767.98px) {
    .section-title {
        margin-bottom: 24px !important;
    }
}

@media (max-width: 991.98px) {
    .section-title {
        padding-inline: 0 !important;
    }
}

.sub-title {
    text-transform: none;
    text-align: start;
    color: var(--text-muted);
}

.banner .left-heading h1 {
    font-weight: 500;
    font-size: 66px;
    font-size: clamp(20px, 20px + 0vw, 20px);
    color: var(--primary-accent);
}

@media (min-width: 768px) {
    .banner .left-heading h1 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .banner .left-heading h1 {
        font-size: clamp(20px, -56.6666666667px + 6.3888888889vw, 66px);
    }
}

@media (max-width: 991.98px) {
    .banner .left-heading h1 {
        font-size: 30px;
        margin-bottom: 24px !important;
    }
}

.banner .left-heading p {
    color: var(--light-primary);
    font-weight: 400;
    font-size: 56px;
    font-size: clamp(20px, 20px + 0vw, 20px);
}

@media (min-width: 768px) {
    .banner .left-heading p {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .banner .left-heading p {
        font-size: clamp(20px, -40px + 5vw, 56px);
    }
}

@media (max-width: 991.98px) {
    .banner .left-heading p {
        font-size: 20px;
    }
}

.banner .right-heading p {
    font-weight: 400;
    line-height: 30px;
    color: var(--text-muted);
}

@media (max-width: 991.98px) {
    .banner .right-heading p {
        font-size: 18px;
    }
}

.banner .banner-slider {
    position: relative;
}

@media (max-width: 767.98px) {
    .banner .banner-slider {
        padding-block: 24px !important;
    }
}

.banner .slider {
    height: 600px;
    height: clamp(300px, 300px + 0vw, 300px);
    overflow: hidden;
    position: relative;
}

@media (min-width: 768px) {
    .banner .slider {
        height: clamp(300px, 100px + 26.0416666667vw, 600px);
    }
}

@media (max-width: 767.98px) {
    .banner .slider {
        height: 400px;
    }
}

@media (max-width: 575.98px) {
    .banner .slider {
        height: 350px;
    }
}

.banner .slider .slide-track {
    display: flex;
    width: 100%;
    height: 100%;
    transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1);
    transform: translateX(0);
}

@media (max-width: 767.98px) {
    .banner .slider .slide-track {
        transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
    }
}

.banner .slider .slide-track.no-transition, .banner .slider .slide-track.no-transition .slide {
    transition: none !important;
}

.banner .slider .slide-track .slide {
    height: 100%;
    margin-inline-end: 20px;
    border-radius: 16px;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
    --var-width: 8.3%;
    --var-activewidth: 70%;
    width: var(--var-width);
    flex-basis: var(--var-width);
    min-width: 0;
    transition: width 1s cubic-bezier(0.22, 1, 0.36, 1), flex-basis 1s cubic-bezier(0.22, 1, 0.36, 1);
}

@media (max-width: 767.98px) {
    .banner .slider .slide-track .slide {
        --var-width: 100%;
        --var-activewidth: 100%;
        margin-inline-end: 0;
        width: 100% !important;
        flex-basis: 100% !important;
        min-width: 100%;
    }
}

@media (max-width: 575.98px) {
    .banner .slider .slide-track .slide {
        margin-inline-end: 0;
    }
}

.banner .slider .slide-track .slide:last-child {
    margin-inline-end: 0;
}

.banner .slider .slide-track .slide.cloned {
    width: var(--var-width) !important;
    flex-basis: var(--var-width) !important;
    transition: width 1s cubic-bezier(0.22, 1, 0.36, 1), flex-basis 1s cubic-bezier(0.22, 1, 0.36, 1);
}

@media (max-width: 767.98px) {
    .banner .slider .slide-track .slide.cloned {
        width: 100% !important;
        flex-basis: 100% !important;
    }
}

.banner .slider .slide-track .slide.cloned .slide-caption {
    opacity: 0;
    transform: translateY(30px);
    pointer-events: none;
    transition: opacity 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition-delay: 0s;
}

.banner .slider .slide-track .slide.active {
    width: var(--var-activewidth) !important;
    flex-basis: var(--var-activewidth) !important;
    transition: width 1s cubic-bezier(0.22, 1, 0.36, 1), flex-basis 1s cubic-bezier(0.22, 1, 0.36, 1);
}

@media (max-width: 767.98px) {
    .banner .slider .slide-track .slide.active {
        width: 100% !important;
        flex-basis: 100% !important;
    }
}

.banner .slider .slide-track .slide.active .slide-caption {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
    transition: opacity 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition-delay: 0.35s;
}

.banner .slider .slide-track .slide img {
    width: 30px;
    height: 30px;
    object-fit: cover;
    border-radius: 16px;
    display: block;
    will-change: transform;
    transform-origin: center center;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    transform: scale(1.5) translate3d(0, 0, 0);
    transition: transform 1s cubic-bezier(0.22, 1, 0.36, 1);
}

.banner .slider .slide-track .slide.active img {
    transform: scale(1) translate3d(0, 0, 0) !important;
    transition: transform 1s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

.banner .slider .slide-track .slide.cloned img {
    transform: scale(1.5) translate3d(0, 0, 0) !important;
    transition: transform 1s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

.banner .slider .slide-track .slide .slide-caption {
    position: absolute;
    inset-inline-end: 15%;
    bottom: 1.25rem;
    inset-inline-start: 5%;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    text-align: start;
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: 2;
    user-select: none;
}

@media (max-width: 767.98px) {
    .banner .slider .slide-track .slide .slide-caption {
        inset-inline-end: 5%;
        bottom: 1rem;
        padding-top: 1rem;
        padding-bottom: 1rem;
    }
}

@media (max-width: 575.98px) {
    .banner .slider .slide-track .slide .slide-caption {
        inset-inline-start: 1rem;
        inset-inline-end: 1rem;
        bottom: 0.75rem;
        padding-top: 0.75rem;
        padding-bottom: 0.75rem;
    }
}

.banner .slider .slide-track .slide .slide-caption h4 {
    font-size: 24px;
    text-align: start;
    margin-bottom: 0.75rem;
}

@media (max-width: 767.98px) {
    .banner .slider .slide-track .slide .slide-caption h4 {
        font-size: 20px;
        margin-bottom: 0.5rem;
    }
}

@media (max-width: 575.98px) {
    .banner .slider .slide-track .slide .slide-caption h4 {
        font-size: 18px;
    }
}

.banner .slider .slide-track .slide .slide-caption p {
    color: rgba(255, 255, 255, 0.8) !important;
    text-align: start;
    margin-bottom: 0.75rem;
}

@media (max-width: 767.98px) {
    .banner .slider .slide-track .slide .slide-caption p {
        font-size: 16px;
        margin-bottom: 0.5rem;
    }
}

@media (max-width: 575.98px) {
    .banner .slider .slide-track .slide .slide-caption p {
        font-size: 14px;
    }
}

.banner .slider .slide-track .slide .slide-caption a {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    border-bottom: 1px solid var(--on-primary);
    width: fit-content;
    margin-top: 15px;
    text-align: start;
    text-decoration: none;
    transition: all 0.3s ease;
}

@media (max-width: 575.98px) {
    .banner .slider .slide-track .slide .slide-caption a {
        font-size: 14px;
        margin-top: 10px;
    }
}

.banner .slider .slide-track .slide .slide-caption a:hover {
    opacity: 0.8;
}

.banner .slider .slide-track .slide .slide-caption a span {
    padding-bottom: 3px;
    margin-inline-end: 20px;
}

@media (max-width: 575.98px) {
    .banner .slider .slide-track .slide .slide-caption a span {
        margin-inline-end: 10px;
    }
}

html[dir=rtl] .banner .slider .slide-track .slide .slide-caption a i::before {
    transform: scaleX(-1);
}

.banner .slider .slide-track .slide .overlay {
    background: linear-gradient(179.91deg, rgba(0, 0, 0, 0) 29.28%, #000000 114.07%);
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 16px;
    z-index: 1;
    will-change: opacity;
    transition: opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.active .banner .slider .slide-track .slide .overlay {
    opacity: 0.85;
    background: linear-gradient(179.91deg, rgba(0, 0, 0, 0) 29.28%, rgba(0, 0, 0, 0.75) 114.07%);
}

.cloned .banner .slider .slide-track .slide .overlay {
    opacity: 0.95;
    background: linear-gradient(179.91deg, rgba(0, 0, 0, 0) 29.28%, rgba(0, 0, 0, 0.9) 114.07%);
}

.banner .btn {
    width: 195px !important;
    max-width: calc(100% - 32px);
    min-width: 160px;
    line-height: 1;
    background: linear-gradient(93.64deg, var(--primary) -23.72%, var(--purple) 82.41%);
    border-radius: 72px;
    font-family: var(--primary-font);
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--on-primary);
    text-align: center;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    transition: none;
    z-index: 9999;
    position: fixed;
    left: 50%;
    bottom: 20px;
    transform: translateX(-50%);
}

@media (max-width: 767.98px) {
    .banner .btn {
        bottom: 16px !important;
        width: 180px !important;
        min-width: 150px;
    }
}

@media (max-width: 575.98px) {
    .banner .btn {
        bottom: 12px !important;
        width: 160px !important;
        min-width: 140px;
        font-size: 14px;
    }
}

.banner .btn i {
    font-size: 9px;
    color: var(--on-primary);
    display: none;
    align-items: center;
}

@media (max-width: 767.98px) {
    .banner .btn {
        font-size: 12px !important;
    }
}

@media (min-width: 992px) and (max-width: 1400px) {
    .banner .btn {
        font-size: 12px !important;
    }
}

.banner .btn span {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: none;
    transform: none;
}

    .banner .btn span i {
        opacity: 1;
        transition: opacity 0.35s ease, transform 0.35s ease;
        display: none;
    }

@media (max-width: 575.98px) {
    .banner .btn span {
        font-size: 14px;
    }
}

.banner .btn:hover {
    background: linear-gradient(-93.64deg, var(--primary) -23.72%, var(--purple) 82.41%);
}

    .banner .btn:hover span i {
        opacity: 0;
        transform: translateX(500%);
    }

html[dir=rtl] .banner .btn:hover span i {
    transform: translateX(-500%);
}

.banner .btn:hover span::before {
    opacity: 1;
}

@media (max-width: 575.98px) {
    .hero-banner {
        padding: 0;
    }
}

.hero-banner .hero-banner-main {
    background-color: var(--surface);
    border-radius: 20px;
    position: relative;
    overflow: hidden;
    padding-top: 15%;
    padding-bottom: 120px;
    min-height: 100vh;
}

@media (max-width: 1199.98px) {
    .hero-banner .hero-banner-main {
        padding-top: 22%;
    }
}

@media (max-width: 991.98px) {
    .hero-banner .hero-banner-main {
        min-height: auto;
    }
}

@media (max-width: 767.98px) {
    .hero-banner .hero-banner-main {
        padding-top: 22%;
        padding-bottom: 100px;
    }
}

@media (max-width: 575.98px) {
    .hero-banner .hero-banner-main {
        min-height: auto;
        padding-top: 120px;
        padding-bottom: 80px;
        border-radius: 0;
    }
}

.hero-banner .hero-banner-main::after {
    content: "";
    position: absolute;
    top: 0;
    inset-inline-start: 0;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    background: linear-gradient(180.07deg, rgba(195, 182, 209, 0) 32.43%, rgba(56, 16, 97, 0) 99.94%), linear-gradient(270deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.16) 100%);
    z-index: 1;
    pointer-events: none;
}

@media (max-width: 575.98px) {
    .hero-banner .hero-banner-main::after {
        border-radius: 0;
    }
}

.hero-banner .hero-banner-main .video-box {
    position: absolute;
    top: 0;
    inset-inline-start: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
}

    .hero-banner .hero-banner-main .video-box video {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.hero-banner .hero-banner-main .content-box {
    position: relative;
    z-index: 2;
    padding-bottom: 95px;
    position: relative;
    width: fit-content;
}

    .hero-banner .hero-banner-main .content-box::after {
        content: '';
        position: absolute;
        inset: -20px;
        backdrop-filter: blur(4px);
        -webkit-mask-image: linear-gradient(to right, transparent 0%, black 20px, black calc(100% - 20px), transparent 100%), linear-gradient(to bottom, transparent 0%, black 20%, black 80%, transparent 100%);
        -webkit-mask-composite: destination-in;
        mask-image: linear-gradient(to right, transparent 0%, black 20px, black calc(100% - 20px), transparent 100%), linear-gradient(to bottom, transparent 0%, black 20%, black 80%, transparent 100%);
        mask-composite: intersect;
        z-index: -1;
    }

    .hero-banner .hero-banner-main .content-box > * {
        position: relative;
        z-index: 1;
    }

.hero-banner .hero-banner-main .hero-line {
    width: 100%;
    height: 1px;
    margin-bottom: 30px;
    background: linear-gradient(90deg, var(--surface) 0%, rgba(153, 153, 153, 0) 100%);
    position: relative;
    z-index: 2;
}

html[dir=rtl] .hero-banner .hero-banner-main .hero-line {
    transform: scaleX(-1);
}

@media only screen and (max-width: 1599.98px) {
    .hero-banner .hero-banner-main .content-box {
        padding-bottom: 70px;
    }
}

@media (max-width: 991.98px) {
    .hero-banner .hero-banner-main .content-box {
        padding-bottom: 50px;
    }
}

@media (max-width: 575.98px) {
    .hero-banner .hero-banner-main .content-box {
        padding-bottom: 30px;
    }
}

@media (max-width: 575.98px) {
    .hero-banner .hero-banner-main .content-box h1 br {
        display: none;
    }
}

.hero-banner .hero-banner-main .content-box .button-box {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 1rem;
}

@media (max-width: 575.98px) {
    .hero-banner .hero-banner-main .content-box .button-box {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media only screen and (max-width: 1599.98px) {
    .hero-banner .hero-banner-main .content-box .button-box {
        gap: 0.5rem;
    }
}

.hero-banner .hero-banner-main .content-box .button-box a,
.hero-banner .hero-banner-main .content-box .button-box button {
    min-height: 58px;
}

@media only screen and (max-width: 1599.98px) {
    .hero-banner .hero-banner-main .content-box .button-box a,
    .hero-banner .hero-banner-main .content-box .button-box button {
        min-height: auto;
        padding: 14px 20px;
    }
}

@media (max-width: 767.98px) {
    .hero-banner .hero-banner-main .content-box .button-box a,
    .hero-banner .hero-banner-main .content-box .button-box button {
        min-height: auto;
        line-height: 1;
    }
}

.hero-banner .hero-banner-main .slider-box {
    position: relative;
    z-index: 2;
    width: calc(177px + 12px + 340px);
    max-width: 100%;
}

    .hero-banner .hero-banner-main .slider-box::before {
        content: '';
        position: absolute;
        inset: 0;
        backdrop-filter: blur(3px);
        -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 40%);
        mask-image: linear-gradient(to bottom, transparent 0%, black 40%);
        z-index: 0;
    }

    .hero-banner .hero-banner-main .slider-box > * {
        position: relative;
        z-index: 1;
    }

.hero-banner .hero-banner-main .slider-box .slider-item {
    display: flex !important;
    align-items: center;
    justify-content: start;
    gap: 12px;
}

@media (max-width: 575.98px) {
    .hero-banner .hero-banner-main .slider-box .slider-item {
        flex-direction: column;
        align-items: flex-start;
    }
}

.hero-banner .hero-banner-main .slider-box .slider-item figure {
    width: 177px;
    min-width: 177px;
    height: 145px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.1294117647);
    overflow: hidden;
    border: 0;
    position: relative;
}

.hero-banner .hero-banner-main .slider-box .slider-item figure::before {
    content: "";
    position: absolute;
    top: 0;
    inset-inline-start: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05)), linear-gradient(270deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.31) 100%);
}

.hero-banner .hero-banner-main .slider-box .slider-item figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
    border: 0;
}

.hero-banner .hero-banner-main .slider-box .slider-item .content {
    width: 100%;
}

.hero-banner .hero-banner-main .slider-box .slider-item .content h4 {
    margin-bottom: 12px;
}

.hero-banner .hero-banner-main .slider-box .slider-item .content p {
    margin-bottom: 12px;
    line-height: 17px;
}

@media (max-width: 575.98px) {
    .hero-banner .hero-banner-main .slider-box .slider-item .content p {
        line-height: normal;
    }
}

.hero-banner .hero-banner-main .slider-box .slider-item.has-icon figure {
    display: flex;
    align-items: center;
    justify-content: center;
}

    .hero-banner .hero-banner-main .slider-box .slider-item.has-icon figure::before {
        display: none;
    }

    .hero-banner .hero-banner-main .slider-box .slider-item.has-icon figure img {
        width: 30px;
        height: 30px;
        border-radius: 0;
    }

.hero-banner .hero-banner-main .slider-box .slick-dots {
    position: relative;
    bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 8px;
}

@media (max-width: 575.98px) {
    .hero-banner .hero-banner-main .slider-box .slick-dots {
        bottom: 0;
    }
}

.hero-banner .hero-banner-main .slider-box .slick-dots li button {
    font-size: 0;
    padding: 0;
    border-radius: 50rem;
    width: 12px;
    height: 12px;
    background-color: rgba(240, 240, 240, 0.1490196078);
    border: 0;
    transition: 0.3s all ease;
}

.hero-banner .hero-banner-main .slider-box .slick-dots li.slick-active button {
    background-color: var(--surface);
    transition: 0.3s all ease;
}

.hero-banner .hero-banner-main .scroll-down {
    position: absolute;
    bottom: 130px;
    inset-inline-start: 50%;
    transform: translate(-50%, -50%);
}

@media (max-width: 575.98px) {
    .hero-banner .hero-banner-main .scroll-down {
        bottom: 100px;
    }
}

.scroll-down {
    display: block;
    width: 30px;
}

    .scroll-down .chevron {
        position: absolute;
        width: 1.08rem;
        height: 0.18rem;
        opacity: 0;
        transform: scale(0.3);
        animation: move-chevron 4.5s ease-out infinite;
    }

        .scroll-down .chevron:first-child {
            animation: move-chevron 4.5s ease-out 1.5s infinite;
        }

        .scroll-down .chevron:nth-child(2) {
            animation: move-chevron 4.5s ease-out 3s infinite;
        }

        .scroll-down .chevron:before,
        .scroll-down .chevron:after {
            content: "";
            position: absolute;
            top: 0;
            height: 100%;
            width: 50%;
            background: var(--surface);
        }

        .scroll-down .chevron:before {
            left: 0;
            transform: skewY(45deg);
        }

        .scroll-down .chevron:after {
            right: 0;
            width: 50%;
            transform: skewY(-45deg);
        }

@keyframes move-chevron {
    25% {
        opacity: 1;
    }

    33.3% {
        opacity: 1;
        transform: translateY(2.28rem);
    }

    66.6% {
        opacity: 1;
        transform: translateY(3.12rem);
    }

    100% {
        opacity: 0;
        transform: translateY(4.8rem) scale(0.5);
    }
}

.journey .row.journey-sec {
    background-image: url(../../assets/images/journy-bg.svg), linear-gradient(93.64deg, rgba(37, 18, 90, 0.2784313725) -11.72%, rgba(102, 102, 102, 0.1019607843) 40%);
    background-repeat: no-repeat;
    background-position: left;
    overflow: hidden;
    position: relative;
}

@media (min-width: 1400px) {
    .journey .row.journey-sec:after {
        content: "";
        max-width: 44%;
        position: absolute;
        inset: 0;
        pointer-events: none;
        backdrop-filter: blur(44px);
        -webkit-backdrop-filter: blur(44px);
        mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 29%, rgb(0, 0, 0) 100%);
        -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 29%, rgb(0, 0, 0) 100%);
    }
}

html[dir=rtl] .journey .row.journey-sec {
    background-position: right;
}

@media (max-width: 767.98px) {
    .journey .row.journey-sec {
        padding: 2rem 0 !important;
        background-size: cover;
    }
}

.journey .journey-img {
    position: relative;
    height: 100%;
}

@media (max-width: 991.98px) {
    .journey .journey-img {
        display: flex;
        flex-direction: column;
    }
}

.journey .journey-img img {
    position: relative;
    bottom: -90px;
    inset-inline-start: -32%;
    object-fit: contain;
}

@media only screen and (min-width: 1599.98px) {
    .journey .journey-img img {
        bottom: -50px;
    }
}

html[dir=rtl] .journey .journey-img img {
    inset-inline-start: -9%;
}

@media (max-width: 991.98px) {
    .journey .journey-img img {
        top: 100%;
    }
}

@media only screen and (max-width: 1299.98px) {
    .journey .journey-img img {
        object-fit: cover;
        width: 100%;
        height: 100%;
        object-position: top right;
    }
}

.journey .journey-img .fig-caption {
    position: absolute;
    bottom: 0;
    border-radius: 0px;
    inset-inline-start: -7%;
    z-index: 2;
    padding-inline-start: 10%;
}

@media (max-width: 1530px) and (min-width: 1200px) {
    .journey .journey-img .fig-caption {
        bottom: -10px;
        align-items: center !important;
    }
}

@media (max-width: 767.98px) {
    .journey .journey-img .fig-caption {
        display: none !important;
    }
}

@media (max-width: 991.98px) {
    .journey .journey-img .fig-caption {
        position: relative;
        width: 100% !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        inset-inline-start: -14%;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .journey .journey-img .fig-caption {
        padding-inline-start: 0;
        align-items: center !important;
    }

        .journey .journey-img .fig-caption h4 br {
            display: none;
        }
}

.journey .journey-img .fig-caption h4 {
    font-size: 36px;
    font-size: clamp(18px, 15.1428571429px + 0.8928571429vw, 22px);
    margin-bottom: 0;
}

@media (min-width: 768px) {
    .journey .journey-img .fig-caption h4 {
        font-size: clamp(22px, 22px + 0vw, 22px);
    }
}

@media (min-width: 1200px) {
    .journey .journey-img .fig-caption h4 {
        font-size: clamp(22px, -1.3333333333px + 1.9444444444vw, 36px);
    }
}

@media (max-width: 1530px) and (min-width: 1200px) {
    .journey .journey-img .fig-caption h4 {
        font-size: 30px;
    }
}

@media (max-width: 1199.98px) {
    .journey .journey-img .fig-caption h4 {
        font-size: 28px;
    }
}

.journey .journey-img .fig-caption p {
    font-size: 88px;
    font-size: clamp(20px, 12.8571428571px + 2.2321428571vw, 30px);
    margin-bottom: 0;
    line-height: 1;
}

@media (min-width: 768px) {
    .journey .journey-img .fig-caption p {
        font-size: clamp(30px, 12.2222222222px + 2.3148148148vw, 40px);
    }
}

@media (min-width: 1200px) {
    .journey .journey-img .fig-caption p {
        font-size: clamp(40px, -40px + 6.6666666667vw, 88px);
    }
}

@media (max-width: 1530px) and (min-width: 1200px) {
    .journey .journey-img .fig-caption p {
        font-size: 65px;
    }
}

@media (max-width: 991.98px) {
    .journey .journey-img .fig-caption p {
        font-size: 82px;
    }
}

.journey .journey-form .form-control {
    border: 0;
    border-bottom: 1px solid #d2d2d2;
    font-size: 18px;
    font-size: clamp(12px, 12px + 0vw, 12px);
    font-weight: 400;
    color: #a6a6a6;
    border-radius: 0;
    box-shadow: none;
    padding: 15px 0;
    appearance: auto;
    background-color: transparent;
}

@media (min-width: 768px) {
    .journey .journey-form .form-control {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .journey .journey-form .form-control {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

@media (max-width: 767.98px) {
    .journey .journey-form .form-control {
        font-size: 15px;
    }
}

.journey .journey-form label {
    font-weight: 400;
    font-size: 18px;
    font-size: clamp(12px, 12px + 0vw, 12px);
    color: #131313;
}

@media (min-width: 768px) {
    .journey .journey-form label {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .journey .journey-form label {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

@media (max-width: 767.98px) {
    .journey .journey-form label {
        font-size: 15px;
    }
}

@media (min-width: 1200px) {
    .start-journey .container-sm {
        max-width: -webkit-fill-available !important;
    }
}

@media (max-width: 991.98px) {
    .start-journey .container-sm {
        max-width: fit-content !important;
    }
}

.blur-noise {
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(156.55deg, rgba(239, 239, 239, 0) 31.14%, rgba(239, 239, 239, 0.5) 92.29%);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    mask-image: linear-gradient(to top, black 60%, transparent 100%);
    -webkit-mask-image: linear-gradient(to top, black 60%, transparent 100%);
}

    .blur-noise::after {
        content: "";
        position: absolute;
        inset: 0;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E");
        pointer-events: none;
    }

.setup {
    background: linear-gradient(298.1deg, var(--purple) 3.27%, var(--violet) 125.83%);
    border-radius: 16px 0 0 16px;
    padding: 6rem 4rem;
    position: relative;
    box-sizing: border-box;
    max-width: 100%;
}

html[dir=rtl] .setup {
    border-radius: 0 16px 16px 0px;
}

@media (max-width: 767.98px) {
    .setup {
        padding: 40px 15px !important;
        border-radius: 16px;
        margin-bottom: 20px;
        max-width: 100%;
    }
}

.setup .btn {
    line-height: 1;
    background: var(--surface);
    border-radius: 72px;
    font-family: var(--primary-font);
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--on-primary);
    text-align: center;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    transition: none;
}

@media (max-width: 767.98px) {
    .setup .btn {
        padding-inline: 10px !important;
        height: 40px;
    }
}

.setup .btn i {
    font-size: 9px;
    color: var(--on-primary);
    display: none;
    align-items: center;
}

@media (max-width: 767.98px) {
    .setup .btn {
        font-size: 12px !important;
    }
}

@media (min-width: 992px) and (max-width: 1400px) {
    .setup .btn {
        font-size: 12px !important;
    }
}

.setup .btn span {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: none;
    transform: none;
}

    .setup .btn span i {
        opacity: 1;
        transition: opacity 0.35s ease, transform 0.35s ease;
        display: none;
    }

.setup .btn:hover {
    background: linear-gradient(-93.64deg, var(--primary) -23.72%, var(--purple) 82.41%);
}

    .setup .btn:hover span i {
        opacity: 0;
        transform: translateX(500%);
    }

html[dir=rtl] .setup .btn:hover span i {
    transform: translateX(-500%);
}

.setup .btn:hover span::before {
    opacity: 1;
}

.setup .btn.btn-transparent {
    border: 1px solid rgba(51, 51, 51, 0.1019607843);
    color: var(--purple);
}

    .setup .btn.btn-transparent i {
        color: var(--purple) !important;
    }

.setup-figure {
    position: relative;
    overflow: hidden;
    border-radius: 0 16px 16px 0px;
    max-width: 100%;
    box-sizing: border-box;
}

@media (max-width: 767.98px) {
    .setup-figure {
        padding: 0 !important;
        border-radius: 16px !important;
        max-width: 100%;
        overflow: hidden;
    }
}

html[dir=rtl] .setup-figure {
    border-radius: 16px 0 0 16px;
}

    html[dir=rtl] .setup-figure.ps-0 {
        padding-inline-start: 0 !important;
    }

.setup-figure figure {
    height: 100%;
    max-width: 100%;
    margin: 0;
}

    .setup-figure figure img {
        height: 100%;
        width: 100%;
        max-width: 100%;
        object-fit: cover;
        transition: all 0.3s ease-in-out;
    }

.start-business:has(.new-styles) {
    padding-block: 60px;
}

    .start-business:has(.new-styles):hover .setup-figure figure img {
        scale: none;
    }

    .start-business:has(.new-styles) .setup-figure figure {
        border-radius: 0 16px 16px 0;
    }

        .start-business:has(.new-styles) .setup-figure figure img {
            width: 100%;
        }

    .start-business:has(.new-styles) .new-styles {
        display: flex;
        flex-direction: column;
        align-items: start;
        justify-content: center;
    }

@media (max-width: 767.98px) {
    /* Move image above text on mobile */
    .start-business .setup-figure {
        order: -1;
        border-radius: 16px 16px 0 0 !important;
    }

    /* Flush join with image above, wider side padding, no gap */
    .start-business .setup {
        border-radius: 0 0 16px 16px !important;
        margin-bottom: 0 !important;
        padding: 40px 30px !important;
    }
}

.cardSwiper {
    padding-bottom: 60px !important;
}

@media (max-width: 767.98px) {
    .cardSwiper {
        margin-top: 0 !important;
    }
}

.cardSwiper.swiper {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-block-end: 5rem;
    padding-inline-start: 0;
    padding-inline-end: 0;
}

    .cardSwiper.swiper .swiper-pagination {
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 10px 18px;
        width: auto;
        height: 45px;
        background: rgba(174, 174, 174, 0.2);
        border-radius: 98px;
        left: unset;
        bottom: 0px;
    }

        .cardSwiper.swiper .swiper-pagination .swiper-pagination-bullet {
            width: 14px;
            height: 14px;
            background: var(--surface) !important;
            opacity: 1;
        }

            .cardSwiper.swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
                background: var(--purple) !important;
            }

.cardSwiper .card {
    background: var(--surface);
    border: 1.5px solid var(--border-color);
    border-radius: 16px;
    height: 120px;
    margin: 2px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

@media (max-width: 575.98px) {
    .cardSwiper .card {
        width: 100%;
        height: 120px;
    }
}

.cardSwiper .card .card-body {
    padding: 16px;
    display: flex;
    align-items: center;
    flex: 1;
    overflow: hidden;
    min-height: 0;
    position: relative;
}

.cardSwiper .card.card-journey {
    transition: all 0.5s ease-in-out;
}

    .cardSwiper .card.card-journey .card-body {
        overflow: hidden;
        gap: 12px;
    }

    .cardSwiper .card.card-journey a.card-title {
        color: var(--text-muted);
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        min-width: 0;
        flex: 1;
        overflow: hidden;
        word-wrap: break-word;
        line-height: 1.5;
        padding-inline-end: 24px;
        text-decoration: none;
    }

    .cardSwiper .card.card-journey a:not(.card-title) {
        color: var(--text-muted);
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .cardSwiper .card.card-journey img {
        transition: all 0.3s ease-in-out;
    }

    .cardSwiper .card.card-journey:hover {
        border: 1.5px solid rgba(98, 62, 90, 0.3);
    }

        .cardSwiper .card.card-journey:hover img {
            filter: invert(44%) sepia(33%) saturate(447%) hue-rotate(221deg) brightness(95%) contrast(90%);
        }

        .cardSwiper .card.card-journey:hover a,
        .cardSwiper .card.card-journey:hover .arrow-icon {
            color: var(--purple);
        }

        .cardSwiper .card.card-journey:hover .arrow-icon {
            inset-inline-end: 30px;
            opacity: 1;
        }

    .cardSwiper .card.card-journey .arrow-icon {
        position: absolute;
        inset-inline-end: 15px;
        opacity: 0;
        font-size: 20px;
        transition: all 0.25s cubic-bezier(0.31, -0.105, 0.43, 1.4);
        cursor: pointer;
    }

html[dir=rtl] .cardSwiper .card.card-journey .arrow-icon {
    transform: scaleX(-1);
}

.cardSwiper .card .icon-box {
    height: 100px;
    width: 100px;
    min-height: 100px;
    min-width: 100px;
    max-width: 100px;
    max-height: 100px;
    border-radius: 8px;
    padding: 10px;
    margin-inline-end: 12px;
    opacity: 1;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
}

@media (max-width: 575.98px) {
    .cardSwiper .card .icon-box {
        height: 80px;
        width: 80px;
        min-height: 80px;
        min-width: 80px;
        max-width: 80px;
        max-height: 80px;
    }
}

.cardSwiper .card .icon-box figure {
    margin: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cardSwiper .card .icon-box img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}

@media (max-width: 767.98px) {
    .updates .news-list {
        display: block !important;
    }
}

.updates .news-list .news-box {
    position: relative;
    overflow: hidden;
    cursor: pointer;
    width: calc(50% - 1rem);
}

    .updates .news-list .news-box a::before {
        content: "";
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
    }

    .updates .news-list .news-box figure {
        object-fit: contain;
        background-image: url(../../assets/images/logo.png);
        background-repeat: no-repeat;
        background-size: 80%;
        background-position: center center;
        background-color: var(--surface-3);
        transition: background-position 0.5s ease;
        width: 100%;
        height: 345px;
        border-radius: 16px;
        overflow: hidden;
        position: relative;
    }

@media (max-width: 767.98px) {
    .updates .news-list .news-box figure {
        width: 100% !important;
    }
}

.updates .news-list .news-box figure img {
    transition: all 0.3s ease-in-out;
}

.updates .news-list .news-box:hover h2, .updates .news-list .news-box:hover a {
    color: var(--purple) !important;
}

.updates .news-list .news-box:hover .date-box {
    background: var(--purple) !important;
}

    .updates .news-list .news-box:hover .date-box h4,
    .updates .news-list .news-box:hover .date-box p {
        color: var(--on-primary) !important;
    }

    .updates .news-list .news-box:hover .date-box hr {
        border-color: var(--on-primary) !important;
        opacity: 0.2;
    }

.updates .news-list .news-box:hover figure img {
    scale: 1.04;
}

.updates .news-list .news-box .label {
    position: absolute;
    inset: 16px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 4px 16px 5px;
    gap: 8px;
    width: max-content;
    height: 26px;
    background: rgba(229, 229, 230, 0.8);
    border-radius: 16px;
    font-weight: 400;
    color: var(--purple);
    transition: all 0.5s ease-in-out;
    inset-inline-start: 16px;
}

.updates .news-list .news-box .date-box {
    position: absolute;
    inset-block-end: 13px;
    inset-inline-start: 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 8px 18px;
    background: var(--surface);
    border-radius: 10px;
}

    .updates .news-list .news-box .date-box h4 {
        margin: 0;
    }

    .updates .news-list .news-box .date-box p {
        color: var(--purple);
        margin: 0;
    }

    .updates .news-list .news-box .date-box hr {
        border-top: 0.5px solid rgba(0, 0, 0, 0.2);
        width: 49px;
        opacity: 1;
        margin: 0;
    }

.updates .news-list .news-box.bordererd {
    border: 1px solid var(--border-color);
    padding: 32px;
    border-radius: 16px;
    transition: all 0.5s ease-in-out;
}

@media (max-width: 991.98px) {
    .updates .news-list .news-box.bordererd {
        padding: 10px !important;
    }
}

.updates .news-list .news-box.bordererd .label {
    position: relative;
    inset: 0;
    margin-bottom: 32px;
}

.updates .news-list .news-box.bordererd h2 {
    margin-bottom: 32px;
}

.updates .news-list .news-box.bordererd:hover {
    border-color: var(--violet);
}

    .updates .news-list .news-box.bordererd:hover .label {
        background-color: var(--violet);
        color: var(--on-primary);
    }

@media (max-width: 991.98px) {
    .updates .news-list .news-box {
        width: 100%;
    }
}

.updates .news-details {
    width: 100%;
}

    .updates .news-details p {
        font-weight: 400;
        color: var(--text-muted);
        margin-bottom: 0;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .updates .news-details i {
        font-size: 6px;
    }

        .updates .news-details i.bi-geo-alt {
            font-size: 11px;
        }

    .updates .news-details h2 {
        line-height: 34px;
        height: auto;
        overflow: hidden;
    }

@media (max-width: 575.98px) {
    .updates .news-details h2 {
        line-height: 26px;
    }
}

.updates .border-end {
    height: 84%;
    margin-top: 70px;
    border-color: var(--border);
}

@media (max-width: 767.98px) {
    .updates .border-end {
        border-top: 1px solid var(--border) !important;
        border-right: 0 !important;
        width: 75%;
    }
}

/* Opt this section out of the global `main > section { content-visibility: auto }`
   perf rule: its paint containment would clip the open dropdown list, which needs
   to overflow the section. Scoped so other sections keep the optimization. */
.qfc-wizard {
    content-visibility: visible;
}

.qfc-wizard-inner {
    background-color: var(--surface);
    background-image: radial-gradient(163.87% 338.51% at 12.79% 11.86%, rgba(255, 255, 255, 0) 0%, var(--surface-2) 100%);
    border: 1px solid var(--border);
    padding: 56px;
    border-radius: 16px;
}

@media (max-width: 1199.98px) {
    .qfc-wizard-inner {
        padding: 30px;
    }
}

@media (max-width: 767.98px) {
    .qfc-wizard-inner {
        padding: 30px 20px;
    }
}

.qfc-wizard-inner .row > * {
    padding-right: calc(var(--bs-gutter-x) * 1);
    padding-left: calc(var(--bs-gutter-x) * 1);
}

.qfc-wizard-inner .heading h2 {
    margin-bottom: 12px;
}

.qfc-wizard-inner .heading p {
    margin-bottom: 2rem;
}

.qfc-wizard-inner .form-group .form-label {
    margin-bottom: 20px;
}

/* Bottom-align every field so a longer (wrapping) label doesn't push its
   dropdown out of line with the others. */
.qfc-wizard-inner .form-group {
    display: flex;
    flex-direction: column;
    height: 100%;
}


.qfc-wizard-inner .form-group .qfc-dropdown {
    position: relative;
    width: 100%;
    margin-top: auto;
}

/* Keep the open list above the sections that follow the wizard. */
.qfc-wizard-inner .form-group .qfc-dropdown.open {
    z-index: 1000;
}

.qfc-wizard-inner .form-group .qfc-dropdown-trigger {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 12px 16px;
    background: var(--surface);
    border: 1px solid #d2d2d2;
    border-radius: 8px;
    cursor: pointer;
    font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    font-weight: 400;
    color: var(--text-subtle);
    text-align: start;
    transition: border-color 0.2s ease, color 0.2s ease;
    line-height: 1.4;
}

    .qfc-wizard-inner .form-group .qfc-dropdown-trigger.has-value {
        color: var(--text-muted);
    }

.qfc-wizard-inner .form-group .qfc-dropdown.open .qfc-dropdown-trigger {
    border-color: var(--primary);
    color: var(--text-muted);
}

.qfc-wizard-inner .form-group .qfc-dropdown-value {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qfc-wizard-inner .form-group .qfc-dropdown-arrow {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    color: var(--text-subtle);
    transition: transform 0.2s ease;
}

.qfc-wizard-inner .form-group .qfc-dropdown.open .qfc-dropdown-arrow {
    transform: rotate(180deg);
    color: var(--primary-accent);
}

.qfc-wizard-inner .form-group .qfc-dropdown-list {
    position: absolute;
    top: calc(100% + 4px);
    inset-inline-start: 0;
    width: 100%;
    background: var(--surface);
    border: 1px solid var(--primary);
    border-radius: 8px;
    overflow: hidden;
    z-index: 200;
    list-style: none;
    margin: 0;
    padding: 0;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

    .qfc-wizard-inner .form-group .qfc-dropdown-list[hidden] {
        display: none;
    }

.qfc-wizard-inner .form-group .qfc-dropdown-option {
    padding: 12px 16px;
    font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    font-weight: 400;
    color: var(--text-muted);
    cursor: pointer;
    border-bottom: 1px solid var(--surface-2);
    transition: background 0.15s ease;
}

    .qfc-wizard-inner .form-group .qfc-dropdown-option:last-child {
        border-bottom: none;
    }

    .qfc-wizard-inner .form-group .qfc-dropdown-option:hover {
        background: #f7f4fb;
    }

    .qfc-wizard-inner .form-group .qfc-dropdown-option.selected {
        color: var(--primary-accent);
        font-weight: 500;
    }

.qfc-wizard-inner button {
    min-width: 160px;
}

/* Match the submit button's height to the dropdown triggers (same box model).
   font-size/line-height need !important to override the global body-text rule in home.css. */
.qfc-wizard-inner .qfc-wizard-btn .updated-primary-btn {
    padding-block: 12px;
    border: 1px solid transparent;
    font-size: clamp(12px, 2px + 0.8333333333vw, 18px) !important;
    line-height: 1.4 !important;
}

@media (max-width: 1199.98px) {
    .qfc-wizard-inner button {
        margin-top: 20px;
    }
}

.event-details {
    border-bottom: 1px solid var(--border);
    padding-block: 1.5rem;
}

    .event-details p {
        font-weight: 400;
        font-size: 14px !important;
        color: var(--text-muted);
        margin-bottom: 0;
    }

    .event-details i {
        font-size: 8px;
        color: var(--purple);
    }

    .event-details a {
        line-height: 28px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

@media (max-width: 767.98px) {
    .event-details a {
        font-size: 18px;
        line-height: 26px;
    }
}

.key-details {
    position: sticky;
    top: 0;
}

@media (min-width: 768px) {
    .key-details {
        top: -12%;
        margin-top: -18%;
    }
}

.key-details .card {
    border: 0;
}

.key-details .card-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 20px 40px;
    gap: 32px;
    height: 70px;
    background: rgba(229, 229, 230, 0.8);
    border-radius: 16px 16px 0px 0px !important;
    border: 0;
    position: sticky;
    top: 0;
    z-index: 9;
}

.key-details .card-body {
    border: 1px solid var(--border-color);
    border-top: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 40px 40px 48px;
    gap: 32px;
    height: 730px;
    border-radius: 0 0 16px 16px !important;
    z-index: 9;
    background-color: var(--surface);
}

    .key-details .card-body .btn {
        padding: 26px 24px !important;
    }

.key-details .card-details-item {
    border-bottom: 1px solid var(--border-color);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    width: 100%;
    padding-bottom: 16px;
}

    .key-details .card-details-item figure img {
        border: 1px solid var(--border-color);
        border-radius: 12px;
    }

    .key-details .card-details-item iframe {
        width: 100%;
        height: 150px;
        border: 1px solid #E7E7E7;
        border-radius: 12px;
    }

.business-tools-sec-inner {
    background-color: var(--surface-2);
    padding: 90px;
    border-radius: 16px;
}

@media (max-width: 1199.98px) {
    .business-tools-sec-inner {
        padding: 45px;
    }
}

@media (max-width: 767.98px) {
    .business-tools-sec-inner {
        padding: 20px;
    }
}

.business-tools-sec-inner .description {
    margin-bottom: 40px;
}

@media (max-width: 1199.98px) {
    .business-tools-sec-inner .description {
        margin-bottom: 24px;
    }
}

@media (max-width: 767.98px) {
    .business-tools-sec-inner .description {
        margin-bottom: 16px;
    }
}

.pointer-tabs-link-box #nav-pills-tab {
    position: relative;
    padding-inline: 2rem 6rem;
    padding-block: 2rem;
    text-align: start;
    width: 100%;
}

@media (max-width: 1399.98px) {
    .pointer-tabs-link-box #nav-pills-tab {
        padding-inline: 3rem 4rem;
        padding-block: 2rem;
    }
}

@media (max-width: 767.98px) {
    .pointer-tabs-link-box #nav-pills-tab {
        padding-inline: 0;
        padding-block: 0 1.5rem;
    }
}

.pointer-tabs-link-box #nav-pills-tab::before {
    content: "";
    position: absolute;
    top: 0;
    inset-inline-end: 0;
    width: 45%;
    height: 100%;
    border-inline-end: 2px solid var(--violet);
    border-block-end: 2px solid var(--violet);
    border-block-start: 2px solid var(--violet);
    border-radius: 0px 40px 40px 0px;
}

@media (max-width: 767.98px) {
    .pointer-tabs-link-box #nav-pills-tab::before {
        display: none;
    }
}

.pointer-tabs-link-box #nav-pills-tab .gradient-opacity-box {
    position: absolute;
    top: 0;
    inset-inline-end: 0;
    width: 100%;
    height: 100%;
}

    .pointer-tabs-link-box #nav-pills-tab .gradient-opacity-box::before {
        content: "";
        position: absolute;
        top: -2px;
        inset-inline-end: 15%;
        width: 30%;
        height: 5px;
        background: linear-gradient(90deg, rgb(244, 244, 244) 0%, rgba(244, 244, 244, 0) 100%);
    }

    .pointer-tabs-link-box #nav-pills-tab .gradient-opacity-box::after {
        content: "";
        position: absolute;
        bottom: -2px;
        inset-inline-end: 15%;
        width: 30%;
        height: 5px;
        background: linear-gradient(90deg, rgb(244, 244, 244) 0%, rgba(244, 244, 244, 0) 100%);
    }

/* RTL: position and borders flip via logical properties, but border-radius and the
   gradient direction are physical. Mirror both so the decorative bracket keeps its
   rounded corners on the closed (outer) side and the fade points the same way as in
   English. */
html[dir=rtl] .pointer-tabs-link-box #nav-pills-tab::before {
    border-radius: 40px 0px 0px 40px;
}

html[dir=rtl] .pointer-tabs-link-box #nav-pills-tab .gradient-opacity-box::before,
html[dir=rtl] .pointer-tabs-link-box #nav-pills-tab .gradient-opacity-box::after {
    background: linear-gradient(270deg, rgb(244, 244, 244) 0%, rgba(244, 244, 244, 0) 100%);
}

.pointer-tabs-link-box #nav-pills-tab button {
    text-align: start;
    background-color: transparent;
    padding: 20px 0;
    width: fit-content;
    transition: 0.3s all ease;
    position: relative;
    font-weight: 500;
    color: var(--text-muted);
    max-width: 270px;
    width: 270px;
}

    /* Separation line between tabs */
    .pointer-tabs-link-box #nav-pills-tab button:not(:last-child) {
        border-bottom: 1px solid #ECECEC;
    }

@media (max-width: 767.98px) {
    .pointer-tabs-link-box #nav-pills-tab button {
        padding: 10px 0;
    }
}

.pointer-tabs-link-box #nav-pills-tab button:hover {
    background-color: transparent;
    color: var(--primary-accent);
    transition: 0.3s all ease;
}

.pointer-tabs-link-box #nav-pills-tab button::before {
    content: "";
    position: absolute;
    top: 50%;
    inset-inline-end: calc(-10rem - 100px);
    transform: translate(0, -50%);
    width: 100px;
    height: 1px;
    background-color: var(--violet);
    opacity: 0;
    transition: 0.3s all ease;
}

@media (max-width: 1399.98px) {
    .pointer-tabs-link-box #nav-pills-tab button::before {
        inset-inline-end: calc(-4rem - 80px);
        width: 80px;
    }
}

@media (max-width: 767.98px) {
    .pointer-tabs-link-box #nav-pills-tab button::before {
        display: none;
    }
}

.pointer-tabs-link-box #nav-pills-tab button::after {
    content: "";
    position: absolute;
    top: calc(50% - 0px);
    inset-inline-end: calc(-10rem - 105px);
    transform: translate(0, -50%);
    width: 10px;
    height: 10px;
    border-radius: 50rem;
    background-color: var(--violet);
    opacity: 0;
    transition: 0.3s all ease;
}

@media (max-width: 1399.98px) {
    .pointer-tabs-link-box #nav-pills-tab button::after {
        inset-inline-end: calc(-4rem - 85px);
    }
}

@media (max-width: 767.98px) {
    .pointer-tabs-link-box #nav-pills-tab button::after {
        display: none;
    }
}

.pointer-tabs-link-box #nav-pills-tab button.active {
    background-color: transparent;
    color: var(--primary-accent);
    font-weight: 600;
    transition: 0.3s all ease;
}

    .pointer-tabs-link-box #nav-pills-tab button.active::before {
        opacity: 1;
        transition: 0.3s all ease;
    }

    .pointer-tabs-link-box #nav-pills-tab button.active::after {
        opacity: 1;
        transition: 0.3s all ease;
    }

.pointer-tabs-content-box {
    height: 100%;
    display: flex;
    flex-direction: column;
}

    .pointer-tabs-content-box .tab-content {
        flex: 1;
        display: flex;
        flex-direction: column;
    }

        .pointer-tabs-content-box .tab-content .tab-pane {
            height: 100%;
        }

            .pointer-tabs-content-box .tab-content .tab-pane.active {
                display: flex;
                flex-direction: column;
            }

        .pointer-tabs-content-box .tab-content .pointer-tabs-content-item {
            display: flex;
            flex-direction: column;
            flex: 1;
        }

            .pointer-tabs-content-box .tab-content .pointer-tabs-content-item .updated-primary-btn {
                width: fit-content;
            }

            .pointer-tabs-content-box .tab-content .pointer-tabs-content-item figure {
                height: 240px;
                width: auto;
                border-radius: 16px;
                overflow: hidden;
                margin-bottom: 24px;
                box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
            }

                .pointer-tabs-content-box .tab-content .pointer-tabs-content-item figure img {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    object-position: center center;
                }

.tabbed-content-second-column {
    padding-left: 55px;
}

.pointer-tabs-content-box .tab-content .pointer-tabs-content-item .desc {
    flex: 1;
    overflow-wrap: break-word;
    word-break: break-word;
    min-width: 0;
}

.tools-mobile-accordion .pointer-tabs-content-item .desc {
    overflow-wrap: break-word;
    word-break: break-word;
    min-width: 0;
}

/* Tools section – mobile accordion */
.tools-mobile-accordion .accordion-item:first-child {
    border-top: 1px solid var(--border) !important;
}

.tools-mobile-accordion .accordion-item {
    border-left: 0;
    border-right: 0;
    border-radius: 0px;
    border-bottom: 1px solid var(--border) !important;
}

    /* Top line above the first item (above the accordion block) */
    .tools-mobile-accordion .accordion-item:first-child {
        border-top: 1px solid var(--border) !important;
    }

.tools-mobile-accordion .accordion-body {
    max-width: 100% !important;
}

.tools-mobile-accordion .tools-accordion-item .accordion-button {
    background-color: transparent;
    font-weight: 500;
    color: var(--primary-accent) !important;
    padding-inline-start: 0;
    gap: 0.5rem;
}

.tools-mobile-accordion .accordion-button:not(.collapsed) {
    color: var(--primary-accent);
    font-weight: 600;
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.tools-mobile-accordion .accordion-button:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
}

/* Hide Bootstrap's built-in ::after chevron */
.tools-mobile-accordion .accordion-button::after {
    display: none;
}

/* Custom chevron – rotates 90° when open */
.tools-mobile-accordion .accordion-button .tools-accordion-chevron {
    margin-left: auto;
    flex-shrink: 0;
    color: inherit;
    font-size: 1rem;
    -webkit-transition: -webkit-transform 0.3s ease;
    transition: transform 0.3s ease;
    color: var(--primary-accent) !important;
}

.tools-mobile-accordion .accordion-button:not(.collapsed) .tools-accordion-chevron {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

/* Figure and image inside the accordion mirror the desktop tab-pane style */
.tools-mobile-accordion .pointer-tabs-content-item figure {
    height: 240px;
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 24px;
    -webkit-box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

    .tools-mobile-accordion .pointer-tabs-content-item figure img {
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: center center;
        object-position: center center;
    }

.success label.btn {
    padding: 10px 16px;
    background: #56377c !important;
    border-radius: 8px !important;
    border: 0 !important;
    font-size: 16px;
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .qfc-wizard-btn {
        padding-inline-start: 1rem;
    }
}

@media (min-width: 768px) {
    .success label.btn {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .success label.btn {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

@media (max-width: 400px) {
    .success label.btn {
        width: 100% !important;
    }
}

.success .echo-success {
    background-color: rgba(102, 102, 102, 0.1);
    border-radius: 16px;
    padding: 0 0rem 0 4rem !important;
    position: relative;
    overflow: hidden;
    height: 650px;
    height: clamp(300px, 300px + 0vw, 300px);
}

@media (min-width: 768px) {
    .success .echo-success {
        height: clamp(300px, 66.6666666667px + 30.3819444444vw, 650px);
    }
}

.success .echo-success::before {
    content: "";
    position: absolute;
    inset: 0;
    background: url(../../assets/images/echoes-background.jpg) no-repeat right/contain;
    border-radius: 16px;
    z-index: 0;
}

@media only screen and (max-width: 767.98px) {
    .success .echo-success::before {
        background-image: none;
    }
}

html[dir=rtl] .success .echo-success::before {
    background-size: cover;
}

html[dir=rtl] .success .echo-success::before {
    transform: scaleX(-1);
}

.success .echo-success.home-page {
    background-image: url(../../assets/images/echoes-background.jpg);
}

.success .echo-success h2 {
    line-height: 36px;
    position: relative;
    z-index: 1;
}

@media (max-width: 575.98px) {
    .success .echo-success {
        height: 500px;
    }
}

@media (max-width: 767.98px) {
    .success .echo-success {
        padding: 0px 15px !important;
    }

        .success .echo-success h2 {
            line-height: 30px;
        }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .success .echo-success {
        padding: 0 4rem !important;
    }
}

.success .echo-success .modal .modal-dialog {
    --bs-modal-width: 1280px;
}

    .success .echo-success .modal .modal-dialog .modal-content {
        background-color: transparent;
        border: 0;
    }

        .success .echo-success .modal .modal-dialog .modal-content .modal-header {
            border: 0;
        }

            .success .echo-success .modal .modal-dialog .modal-content .modal-header .btn-close {
                position: absolute;
                inset-inline-end: 50px;
                inset-block-start: 80px;
                z-index: 9;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                padding: 18px;
                gap: 8px;
                width: 15px;
                height: 15px;
                background-color: rgba(255, 255, 255, 0.12);
                border-radius: 96px;
                filter: invert(1);
                opacity: 1;
            }

        .success .echo-success .modal .modal-dialog .modal-content .modal-body video {
            border-radius: 30px;
        }

.success .echo-success .testimonial-slider {
    height: 100%;
    position: relative;
}

    .success .echo-success .testimonial-slider::before {
        content: "";
        position: absolute;
        top: 0;
        inset-inline-start: -2.5%;
        width: 5%;
        height: 100%;
        transform: scaleX(-1);
        background: linear-gradient(86.94deg, rgba(239, 239, 239, 0) 28.43%, rgba(239, 239, 239, 0.3) 50.26%, #efefef 72.06%);
        z-index: 2;
    }

html[dir=rtl] .success .echo-success .testimonial-slider::before {
    transform: scaleX(1);
}

.success .echo-success .testimonial-slider .slick-list,
.success .echo-success .testimonial-slider .slick-track,
.success .echo-success .testimonial-slider .slick-slide,
.success .echo-success .testimonial-slider .slick-slide > div,
.success .echo-success .testimonial-slider .slide-item {
    height: 100%;
}



@media (max-width: 767.98px) {
    .success .btn {
        width: 270px;
    }
}

.testimonial-slider {
    position: relative;
    z-index: 1;
}

    .testimonial-slider figure {
        margin-bottom: 0;
        position: absolute;
        bottom: 0;
        -webkit-mask-image: linear-gradient(to right, transparent, black 20%);
        mask-image: linear-gradient(to right, transparent, black 20%);
        overflow: hidden;
        height: 100%;
    }

        .testimonial-slider figure img {
            transform: translateX(5rem);
            transition: all 3s cubic-bezier(0.16, 1, 0.3, 1);
            height: 100%;
        }

@media (max-width: 991.98px) {
    .testimonial-slider figure {
        height: 300px;
        width: 100%;
    }

        .testimonial-slider figure img {
            width: 100%;
            height: 100% !important;
            object-fit: contain !important;
            opacity: 1;
        }
}

.testimonial-slider .slide-content {
    overflow: hidden;
    padding-top: 6rem;
    padding-inline-start: 25px;
    position: relative;
    z-index: 1;
}

html[dir=rtl] .testimonial-slider .slide-content img {
    transform: scaleX(-1);
}

@media (max-width: 991.98px) {
    .testimonial-slider .slide-content {
        padding-top: 0 !important;
    }
}

@keyframes slideright {
    0% {
        opacity: 0;
        -webkit-transform: translateX(var(--Xt));
        transform: translateX(var(--Xt));
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(var(--Yt));
        transform: translateX(var(--Yt));
    }
}

@keyframes slideleft {
    0% {
        opacity: 1 !important;
    }

    100% {
        opacity: 0 !important;
        -webkit-transform: translateX(var(--Xl));
        transform: translateX(var(--Xl));
    }
}

@keyframes captionLeft {
    0% {
        transform: translateX(var(--tx));
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

.testimonial-slider .slick-slide.slick-active .slide-content img,
.testimonial-slider .slick-slide.slick-active .slide-content h2,
.testimonial-slider .slick-slide.slick-active .slide-content p,
.testimonial-slider .slick-slide.slick-active .slide-content label {
    opacity: 0;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transition: all 3s cubic-bezier(0.16, 1, 0.3, 1);
    transition: all 3s cubic-bezier(0.16, 1, 0.3, 1);
    --Xt: 100%;
    --Yt: 0;
}

.video-showcase-carousel .testimonial-slider .slick-slide.slick-active .slide-content h2 {
    font-weight: 700 !important;
}

/* videoShowcaseCarousel mobile layout lives in _css/videoShowcaseCarousel.css */

.testimonial-slider .slick-slide.slick-active .slide-content label {
    animation: slideright 1.5s forwards;
    -webkit-transition-delay: 1.5s;
    transition-delay: 1.5s;
}

.testimonial-slider .slick-slide.slick-active .slide-content img,
.testimonial-slider .slick-slide.slick-active .slide-content h2 {
    animation: slideright 1.6s forwards;
    -webkit-transition-delay: 1.6s;
    transition-delay: 1.6s;
}

.testimonial-slider .slick-slide.slick-active .slide-content p {
    animation: slideright 1.8s forwards;
    -webkit-transition-delay: 1.8s;
    transition-delay: 1.8s;
}

.testimonial-slider .slick-slide.slick-active figure img {
    transform: translateX(0);
    transition: all 3s cubic-bezier(0.16, 1, 0.3, 1);
}

.testimonial-slider .slick-slide.slick-active figure .fig-caption {
    --tx: 10rem;
    animation: captionLeft 1s forwards;
    transition: all 3s cubic-bezier(0.16, 1, 0.3, 1);
}

.testimonial-slider .slick-slide.slide-out {
    transition-delay: 3s;
}

    .testimonial-slider .slick-slide.slide-out .slide-content {
        --Xl: -500%;
        animation: slideleft 5s forwards;
        transition-delay: 1.3s;
        -webkit-mask-image: linear-gradient(to right, transparent, black 20%);
        mask-image: linear-gradient(to right, transparent, black 20%);
    }

    .testimonial-slider .slick-slide.slide-out figure .fig-caption {
        transition-delay: 5s;
        transform: translateX(-100%) !important;
    }

.testimonial-slider .slick-slide.currentNext.slick-active .slide-content h2,
.testimonial-slider .slick-slide.currentNext.slick-active .slide-content p,
.testimonial-slider .slick-slide.currentNext.slick-active .slide-content label {
    opacity: 0;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transition: all 3s cubic-bezier(0.16, 1, 0.3, 1);
    transition: all 3s cubic-bezier(0.16, 1, 0.3, 1);
    --Xt: -100%;
    --Yt: 0;
}

.testimonial-slider .slick-slide.currentNext.slick-active .slide-content label {
    animation: slideright 1.5s forwards;
    -webkit-transition-delay: 1.5s;
    transition-delay: 1.5s;
}

.testimonial-slider .slick-slide.currentNext.slick-active .slide-content h2 {
    -webkit-transition-delay: 1.6s;
    transition-delay: 1.6s;
}

.testimonial-slider .slick-slide.currentNext.slick-active .slide-content p {
    animation: slideright 1.8s forwards;
    -webkit-transition-delay: 1.8s;
    transition-delay: 1.8s;
}

.testimonial-slider .slick-slide.currentNext.slick-active figure img {
    transform: translateX(0rem);
    transition: all 3s cubic-bezier(0.16, 1, 0.3, 1);
}

.testimonial-slider .slick-slide.currentNext.slick-active figure .fig-caption {
    --tx: -100%;
    animation: captionLeft 1s forwards;
    transition: all 3s cubic-bezier(0.16, 1, 0.3, 1);
}

.testimonial-slider .slick-slide.currentSlideout {
    transition-delay: 10s;
}

    .testimonial-slider .slick-slide.currentSlideout .slide-content {
        --Xl: 100%;
        animation: slideleft 5s forwards;
        transition-delay: 1.3s;
        -webkit-mask-image: linear-gradient(to right, transparent, black 20%);
        mask-image: linear-gradient(to right, transparent, black 20%);
    }

    .testimonial-slider .slick-slide.currentSlideout .fig-caption {
        --tx: -100%;
        animation: captionLeft 1s forwards;
        transition: all 3s cubic-bezier(0.16, 1, 0.3, 1);
    }

@media (min-width: 992px) {
    .testimonial-slider .slick-slide .fig-caption p {
        max-width: 275px;
    }
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .testimonial-slider figure {
        height: 100%;
        place-content: end;
    }

    .testimonial-slider .slick-list .slide-item p.text-secondary {
        padding-bottom: 6rem;
    }

    .testimonial-slider .fig-caption {
        height: 100% !important;
        bottom: 0 !important;
        align-items: center;
        backdrop-filter: blur(1.3px);
    }
}

.testimonial-slider .caption-div {
    height: 40%;
    position: absolute;
    bottom: 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

    .testimonial-slider .caption-div::before {
        content: '';
        position: absolute;
        inset: 0;
        background: linear-gradient(156.55deg, rgba(239, 239, 239, 0) 31.14%, rgba(239, 239, 239, 0.5) 92.29%);
        backdrop-filter: blur(4px);
        -webkit-mask-image: linear-gradient(to right, transparent 0%, black 5%, black 95%, transparent 100%), linear-gradient(to bottom, transparent 0%, black 40%);
        -webkit-mask-composite: source-in;
        mask-image: linear-gradient(to right, transparent 0%, black 5%, black 95%, transparent 100%), linear-gradient(to bottom, transparent 0%, black 40%);
        mask-composite: intersect;
        z-index: 0;
    }

    .testimonial-slider .caption-div > * {
        position: relative;
        z-index: 1;
    }

@media (max-width: 768px) {
    .testimonial-slider .caption-div::before {
        background: none;
        backdrop-filter: none;
        -webkit-mask-image: none;
        mask-image: none;
    }

    .testimonial-slider .caption-div {
        background: none !important;
        backdrop-filter: none !important;
    }
}

.testimonial-slider .fig-caption {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border-radius: 0px;
    width: 100%;
    height: 40%;
    text-align: center;
}

@media (max-width: 768px) {
    .testimonial-slider .fig-caption {
        backdrop-filter: none !important;
    }
}

.testimonial-slider .fig-caption h4 {
    font-weight: 700;
    font-size: 23px;
    font-size: clamp(14px, 12.5714285714px + 0.4464285714vw, 16px);
    color: var(--on-primary);
    width: 62%;
    text-align: center;
}

@media (min-width: 768px) {
    .testimonial-slider .fig-caption h4 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .testimonial-slider .fig-caption h4 {
        font-size: clamp(16px, 4.3333333333px + 0.9722222222vw, 23px);
    }
}

.testimonial-slider .fig-caption p {
    font-weight: 400;
    font-size: 17px;
    font-size: clamp(12px, 12px + 0vw, 12px);
    color: var(--on-primary);
    margin-bottom: 0;
}

@media (min-width: 768px) {
    .testimonial-slider .fig-caption p {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .testimonial-slider .fig-caption p {
        font-size: clamp(12px, 3.6666666667px + 0.6944444444vw, 17px);
    }
}

.testimonial-slider .fig-caption span {
    width: 70px;
    height: 2px;
    background-color: var(--surface);
    margin: 10px;
    display: none;
}

@media (max-width: 575.98px) {
    .testimonial-slider .fig-caption h4 {
        font-size: 18px;
    }

    .testimonial-slider .fig-caption p {
        font-size: 14px;
    }

    .testimonial-slider .fig-caption span {
        width: 40px;
    }
}

@media (max-width: 1199.98px) {
    .testimonial-slider .fig-caption {
        height: 100%;
        align-items: center;
        backdrop-filter: blur(1.3px);
        justify-content: start;
        bottom: 0;
        padding-top: 5px;
    }
}

.testimonial-slider .btn.btn-transparent {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 18px 32px;
    gap: 4px;
    width: 178px;
    height: 60px;
    background: rgba(255, 255, 255, 0.3019607843) !important;
    border-radius: 96px;
    border: 1px solid #d3d1d6 !important;
}

    .testimonial-slider .btn.btn-transparent:hover {
        background: #ded4e9 !important;
        border: 1px solid var(--purple) !important;
        color: var(--purple) !important;
    }

    .testimonial-slider .btn.btn-transparent img {
        transition: none !important;
        transform: none !important;
    }

    .testimonial-slider .btn.btn-transparent i {
        font-size: 24px;
        margin-inline: 2px !important;
    }

html[dir=rtl] .testimonial-slider .btn.btn-transparent i {
    transform: scaleX(-1);
}

@media only screen and (max-width: 1599.98px) {
    .testimonial-slider .btn.btn-transparent {
        width: fit-content;
        height: auto;
        padding: 16px 26px;
    }

        .testimonial-slider .btn.btn-transparent i {
            font-size: 20px;
        }

        .testimonial-slider .btn.btn-transparent img {
            height: 16px;
        }
}

@media (max-width: 991.98px) {
    .testimonial-slider .btn.btn-transparent {
        transform: translateX(0);
        inset-inline: 0;
        bottom: 0;
        height: 40px !important;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .testimonial-slider .btn.btn-transparent {
        bottom: 2%;
        transform: translateX(-50%);
        inset-inline: 80%;
    }
}

@media (max-width: 991.98px) {
    .testimonial-slider .btn.btn-transparent img {
        height: 16px !important;
        opacity: 1;
        width: fit-content !important;
    }
}

.testimonial-slider .slick-prev.slick-arrow,
.testimonial-slider .slick-next.slick-arrow {
    position: absolute;
    bottom: 8%;
    gap: 8px;
    width: 60px;
    height: 60px;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 100%;
    font-size: 0;
    border: 1px solid var(--purple);
    z-index: 9;
}

@media only screen and (max-width: 1599.98px) {
    .testimonial-slider .slick-prev.slick-arrow,
    .testimonial-slider .slick-next.slick-arrow {
        width: 45px;
        height: 45px;
    }

        .testimonial-slider .slick-prev.slick-arrow::before,
        .testimonial-slider .slick-next.slick-arrow::before {
            font-size: 1rem !important;
        }
}

.testimonial-slider .slick-prev.slick-arrow.slick-disabled,
.testimonial-slider .slick-next.slick-arrow.slick-disabled {
    border-color: rgba(96, 63, 131, 0.3215686275);
    opacity: 0.8;
}

@media (max-width: 991.98px) {
    .testimonial-slider .slick-prev.slick-arrow,
    .testimonial-slider .slick-next.slick-arrow {
        width: 40px;
        height: 40px;
    }

        .testimonial-slider .slick-prev.slick-arrow::before,
        .testimonial-slider .slick-next.slick-arrow::before {
            font-size: 1.2rem !important;
        }

        .testimonial-slider .slick-prev.slick-arrow.slick-next,
        .testimonial-slider .slick-next.slick-arrow.slick-next {
            inset-inline-start: unset !important;
            inset-inline-end: 0 !important;
        }
}

@media (min-width: 768px) and (max-width: 1399.98px) {
    .testimonial-slider .slick-prev.slick-arrow,
    .testimonial-slider .slick-next.slick-arrow {
        bottom: 30px !important;
    }
}

.testimonial-slider .slick-next.slick-arrow {
    inset-inline-start: 105px;
}

@media only screen and (max-width: 1599.98px) {
    .testimonial-slider .slick-next.slick-arrow {
        inset-inline-start: 85px;
    }
}

.testimonial-slider .slick-next.slick-arrow::before {
    content: "\f285";
    font-family: bootstrap-icons !important;
    color: var(--purple);
    font-size: 1.5rem;
}

html[dir=rtl] .testimonial-slider .slick-next.slick-arrow {
    transform: scaleX(-1);
}

.testimonial-slider .slick-prev.slick-arrow {
    inset-inline-start: 25px;
}

    .testimonial-slider .slick-prev.slick-arrow::before {
        content: "\f284";
        font-family: bootstrap-icons !important;
        color: var(--purple);
        font-size: 1.5rem;
    }

html[dir=rtl] .testimonial-slider .slick-prev.slick-arrow {
    transform: scaleX(-1);
}

.testimonial-slider .slide-item {
    transition: opacity 0.8s ease-in-out, transform 0.8s ease-in-out;
}

.testimonial-slider .slick-current .slide-item {
    opacity: 1;
    transform: translateY(0);
}

:root {
    --var-width: 14%;
    --var-activewidth: 61.4%;
    --section-spacing-desktop: 80px;
    --section-spacing-laptop: 4rem;
    --section-spacing-tablet: 3rem;
    --section-spacing-mobile: 2rem;
}


.start-journey .card-journey {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 18.493px;
    gap: 9.25px;
    background: linear-gradient(93.64deg, var(--primary) -23.72%, var(--purple) 82.41%);
    border: 0;
    border-radius: 16px;
    height: 100%;
    width: 100%;
    opacity: 100%;
    transition: 0.5s all ease;
}

@media (min-width: 1024px) {
    .start-journey .card-journey {
        padding: 35.5px;
    }
}

@media (max-width: 767.98px) {
    .start-journey .card-journey {
        margin-block: 0.5rem !important;
    }
}

.start-journey .card-journey .card-body {
    min-height: 100%;
}

.start-journey .card-journey h2 {
    color: var(--on-primary);
    font-size: 48px;
    font-size: clamp(20px, 11.4285714286px + 2.6785714286vw, 32px);
    margin-bottom: 24px;
}

@media (min-width: 768px) {
    .start-journey .card-journey h2 {
        font-size: clamp(32px, 32px + 0vw, 32px);
    }
}

@media (min-width: 1200px) {
    .start-journey .card-journey h2 {
        font-size: clamp(32px, 5.3333333333px + 2.2222222222vw, 48px);
    }
}

.start-journey .card-journey .card-title {
    font-weight: 400;
    color: var(--on-primary);
    margin-bottom: 15px;
}

.start-journey .card-journey .card-text {
    color: rgba(249, 243, 250, 0.8);
}

.start-journey .card-journey figure {
    padding-block-start: 2rem;
    position: absolute;
    bottom: 5%;
    max-width: 100px;
    width: 100px;
    width: clamp(80px, 94.2857142857px + -4.4642857143vw, 60px);
    aspect-ratio: 1/1;
    height: auto;
    max-height: 100px;
    height: 100px;
    height: clamp(80px, 94.2857142857px + -4.4642857143vw, 60px);
}

@media (min-width: 768px) {
    .start-journey .card-journey figure {
        width: clamp(60px, 24.4444444444px + 4.6296296296vw, 80px);
    }
}

@media (min-width: 1200px) {
    .start-journey .card-journey figure {
        width: clamp(80px, 46.6666666667px + 2.7777777778vw, 100px);
    }
}

@media (min-width: 768px) {
    .start-journey .card-journey figure {
        height: clamp(60px, 24.4444444444px + 4.6296296296vw, 80px);
    }
}

@media (min-width: 1200px) {
    .start-journey .card-journey figure {
        height: clamp(80px, 46.6666666667px + 2.7777777778vw, 100px);
    }
}

.compliance {
    background: rgba(102, 102, 102, 0.1);
    border-radius: 16px;
    padding: 6rem 4rem;
}

@media (max-width: 767.98px) {
    .compliance {
        padding: 2rem 0 !important;
    }
}

.compliance p {
    color: var(--text-muted);
}

@media (min-width: 768px) {
    .compliance .advantage-text {
        margin-block-end: 3rem;
        margin-inline-start: calc(100% - 340px);
    }
}

.compliance figure {
    max-height: 236px;
    overflow: hidden;
}

    .compliance figure img {
        height: 100%;
        object-fit: cover;
        width: 100%;
    }

.compliance .tab-content .tab-pane.fade:not(.show) {
    pointer-events: none;
}

.compliance .tab-content .tab-pane.fade.show {
    pointer-events: auto;
}

.compliance .tab-content .tab-pane figure {
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s ease-in-out;
}

    .compliance .tab-content .tab-pane figure img {
        transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }

.compliance .tab-content .tab-pane h4 {
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1) 0.05s, opacity 0.3s ease-in-out 0.05s;
}

.compliance .tab-content .tab-pane p {
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1) 0.1s, opacity 0.3s ease-in-out 0.1s;
}

.compliance .tab-content .tab-pane:not(.show) figure {
    transform: translateY(12px);
    opacity: 0;
}

.compliance .tab-content .tab-pane:not(.show) h4 {
    transform: translateY(12px);
    opacity: 0;
}

.compliance .tab-content .tab-pane:not(.show) p {
    transform: translateY(12px);
    opacity: 0;
}

.compliance .tab-content .tab-pane.show figure {
    --variant-height: 230px;
    --normal-height: 270px;
    transform: translateY(0);
    opacity: 1;
}

.compliance .tab-content .tab-pane.show h4 {
    transform: translateY(0);
    opacity: 1;
}

.compliance .tab-content .tab-pane.show p {
    transform: translateY(0);
    opacity: 1;
}

@keyframes changeHeight {
    0% {
        max-height: var(--normal-height);
    }

    100% {
        max-height: var(--variant-height);
    }
}

.compliance .compliance-list {
    position: relative;
    padding: 1.5rem 0 1.5rem 2.5rem;
    margin-inline-start: calc(100% - 350px);
}

html[dir=rtl] .compliance .compliance-list {
    padding-inline-start: 2.5rem !important;
}

.compliance .compliance-list::after {
    content: "";
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: calc(100% - 350px);
    width: 30%;
    height: 100%;
    border-inline-start: 1px solid var(--primary);
    border-block-end: 1px solid var(--primary);
    border-block-start: 1px solid var(--primary);
    border-radius: 40px 0 0px 40px;
}

html[dir=rtl] .compliance .compliance-list::after {
    border-radius: 0px 40px 40px 0px;
}

@media (max-width: 767.98px) {
    .compliance .compliance-list {
        padding: 20px 0 !important;
        inset-inline-start: 0 !important;
        margin-inline-start: 5rem;
        margin-top: 2rem;
    }

        .compliance .compliance-list::after {
            inset-inline-start: -30px;
        }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
    .compliance .compliance-list {
        margin-inline-start: 3rem;
    }

        .compliance .compliance-list::after {
            inset-inline-start: 0;
        }
}

.compliance .compliance-list ul {
    border: 0;
    display: block;
    position: relative;
    z-index: 9;
}

@media (min-width: 1200px) and (max-width: 1600px) {
    .compliance .compliance-list ul h4 {
        font-size: 18px !important;
    }

    .compliance .compliance-list ul li button {
        font-size: 16px !important;
    }

        .compliance .compliance-list ul li button.active {
            font-size: 18px !important;
        }
}

.compliance .compliance-list ul li {
    margin-block: 20px;
    --x: 10;
    --y: 10;
}

    .compliance .compliance-list ul li button {
        background: none !important;
        padding: 0;
        font-weight: 500;
        line-height: 28px;
        color: rgba(51, 51, 51, 0.45);
        border: 0;
        white-space: nowrap;
        display: inline-block;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 300px;
        text-align: start;
    }

        .compliance .compliance-list ul li button.active {
            font-size: 22px !important;
            box-shadow: none;
            transition: all 0.5s ease;
            text-shadow: 2px 2px 5px #d5d5d5;
        }

    .compliance .compliance-list ul li:nth-child(1):has(button.active)::before, .compliance .compliance-list ul li:nth-child(1):has(button.active)::after {
        --x: var(--y);
        --y: 14;
        animation: moveline 3s forwards;
    }

    .compliance .compliance-list ul li:nth-child(2):has(button.active)::before, .compliance .compliance-list ul li:nth-child(2):has(button.active)::after {
        --x: var(--y);
        --y: 62;
        animation: moveline 3s forwards;
    }

    .compliance .compliance-list ul li:nth-child(3):has(button.active)::before, .compliance .compliance-list ul li:nth-child(3):has(button.active)::after {
        --x: var(--y);
        --y: 110;
        animation: moveline 3s forwards;
    }

    .compliance .compliance-list ul li:nth-child(4):has(button.active)::before, .compliance .compliance-list ul li:nth-child(4):has(button.active)::after {
        --x: var(--y);
        --y: 158;
        animation: moveline 3s forwards;
    }

    .compliance .compliance-list ul li:nth-child(5):has(button.active)::before, .compliance .compliance-list ul li:nth-child(5):has(button.active)::after {
        --x: var(--y);
        --y: 206;
        animation: moveline 3s forwards;
    }

@keyframes moveline {
    0% {
        transform: translateY(calc(var(--x) * 1px));
    }

    100% {
        transform: translateY(calc(var(--y) * 1px));
        --x: var(--y);
    }
}

@media (max-width: 1199.98px) {
    .compliance .compliance-list ul li button {
        font-size: 15px !important;
        margin-block: 15px !important;
    }

        .compliance .compliance-list ul li button.active {
            font-size: 16px !important;
        }
}

.compliance .compliance-list ul li:has(button.active)::before, .compliance .compliance-list ul li:has(button.active)::after {
    content: "";
    position: absolute;
    inset-inline-start: calc(100% - 450px);
}

html[dir=rtl] .compliance .compliance-list ul li:has(button.active)::before, html[dir=rtl] .compliance .compliance-list ul li:has(button.active)::after {
    inset-inline-start: calc(100% - 410px);
}

@media (max-width: 767.98px) {
    .compliance .compliance-list ul li:has(button.active)::before, .compliance .compliance-list ul li:has(button.active)::after {
        inset-inline-start: -85px !important;
    }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
    .compliance .compliance-list ul li:has(button.active)::before, .compliance .compliance-list ul li:has(button.active)::after {
        inset-inline-start: -90px !important;
    }
}

.compliance .compliance-list ul li:has(button.active)::before {
    top: -5px;
    width: 10px;
    height: 10px;
    background: linear-gradient(93.64deg, var(--primary) -23.72%, var(--purple) 82.41%);
    border-radius: 50%;
}

.compliance .compliance-list ul li:has(button.active)::after {
    top: 0;
    width: 100px;
    height: 1px;
    background-color: #4b0082;
    transition: transform 0.3s ease-in-out;
}

@media (max-width: 767.98px) {
    .compliance .compliance-list ul li:has(button.active)::after {
        width: 55px;
    }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
    .compliance .compliance-list ul li:has(button.active)::after {
        width: 50px;
    }
}

.card-slider.swiper .swiper-wrapper {
    margin: 2rem 0 4rem;
}

@media (max-width: 1199.98px) {
    .card-slider.swiper .swiper-wrapper {
        margin-top: 0 !important;
    }
}

.card-slider.swiper .swiper-pagination .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    background: linear-gradient(93.64deg, var(--primary) -23.72%, var(--purple) 82.41%), #999999;
    opacity: 0.5;
    border-radius: 50%;
    font-size: 0;
    padding: 5px;
    border: 0;
    transition: all 0.3s ease;
}

    .card-slider.swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
        width: 80px;
        height: 8px !important;
        background: linear-gradient(93.64deg, var(--primary) -23.72%, var(--purple) 82.41%);
        border-radius: 8px;
        opacity: 1;
    }

.card-slider.swiper .swiper-slide.swiper-slide-active .card-journey {
    opacity: 100%;
    transition: 0.5s all ease;
}

@media (max-width: 1199.98px) {
    .card-slider.swiper {
        padding-block-end: 2.5rem;
    }

        .card-slider.swiper .swiper-wrapper .swiper-slide .card .card-body h2 {
            font-size: 26px !important;
        }

        .card-slider.swiper .swiper-wrapper .swiper-slide .card .card-body h5 {
            font-size: 24px !important;
        }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .card-slider.swiper .swiper-wrapper .swiper-slide .card .card-body h2 {
        font-size: 30px !important;
    }

    .card-slider.swiper .swiper-wrapper .swiper-slide .card .card-body h5 {
        font-size: 28px !important;
    }
}

@media (max-width: 767.98px) {
    .card-slider.swiper .swiper-wrapper .swiper-slide .card {
        width: 100%;
    }
}

.card-slider.swiper .swiper {
    width: 100%;
    overflow: hidden;
}

.card-slider.swiper.pre-init .swiper-slide {
    opacity: 0;
}

.card-slider.swiper .swiper-slide {
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    border-radius: 12px;
    transition: all 1s ease;
    margin-inline-end: 30px !important;
    height: 472px;
    height: clamp(300px, 300px + 0vw, 300px);
}

@media (min-width: 768px) {
    .card-slider.swiper .swiper-slide {
        height: clamp(300px, 300px + 0vw, 300px);
    }
}

@media (min-width: 1200px) {
    .card-slider.swiper .swiper-slide {
        height: clamp(300px, 13.3333333333px + 23.8888888889vw, 472px);
    }
}

@media (max-width: 1199.98px) {
    .card-slider.swiper .swiper-slide {
        margin-inline-end: 20px !important;
    }
}

.card-slider.swiper .swiper-slide:last-child {
    margin-inline-end: 0 !important;
}

.card-slider.swiper.swiper-initialized .swiper-slide {
    transition: all 1s ease;
    width: 524px;
    height: 472px;
    height: clamp(300px, 300px + 0vw, 300px);
}

@media (min-width: 768px) {
    .card-slider.swiper.swiper-initialized .swiper-slide {
        height: clamp(300px, 300px + 0vw, 300px);
    }
}

@media (min-width: 1200px) {
    .card-slider.swiper.swiper-initialized .swiper-slide {
        height: clamp(300px, 13.3333333333px + 23.8888888889vw, 472px);
    }
}

@media (max-width: 991.98px) {
    .card-slider.swiper .swiper-slide,
    .card-slider.swiper.swiper-initialized .swiper-slide {
        height: auto;
        align-items: stretch;
    }

    .start-journey .card-journey figure {
        position: static;
        padding-block-start: 1rem;
    }
}

.card-slider .slick-dots {
    display: flex;
    align-items: center;
    justify-content: center;
}

    .card-slider .slick-dots li {
        margin-inline: 10px;
    }

        .card-slider .slick-dots li.slick-active button {
            width: 80px;
            height: 10px;
            background: linear-gradient(93.64deg, var(--primary) -23.72%, var(--purple) 82.41%);
            border-radius: 8px;
            opacity: 1;
        }

    .card-slider .slick-dots button {
        width: 15px;
        height: 15px;
        background: linear-gradient(93.64deg, var(--primary) -23.72%, var(--purple) 82.41%), #999999;
        opacity: 0.5;
        border-radius: 50%;
        font-size: 0;
        padding: 5px;
        border: 0;
    }

.card-slider .slide-item {
    transition: all 2s ease;
}

.card-list {
    background: radial-gradient(163.87% 338.51% at 12.79% 11.86%, rgba(255, 255, 255, 0) 0%, var(--surface-2) 100%), var(--surface);
    border: 1px solid var(--border-color);
    border-radius: 16px;
    position: relative;
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: auto;
    transition: all 0.3s linear;
    overflow: hidden;
}

    .card-list.border-hover:hover {
        border: 1px solid var(--purple);
        transition: all 0.3s linear;
    }

    .card-list .card-title {
        line-height: 30px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

@media (max-width: 767.98px) {
    .card-list .card-title {
        font-size: 20px !important;
        line-height: 26px;
    }
}

@media (max-width: 575.98px) {
    .card-list .card-title {
        font-size: 18px !important;
        line-height: 24px;
    }
}

.card-list .card-text {
    line-height: 24px;
    color: var(--text-muted);
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@media (max-width: 767.98px) {
    .card-list .card-text {
        font-size: 16px !important;
        line-height: 22px;
    }
}

@media (max-width: 575.98px) {
    .card-list .card-text {
        font-size: 14px !important;
        line-height: 20px;
    }
}

@media (max-width: 991.98px) {
    .card-list {
        height: auto !important;
        min-height: 240px;
    }
}

@media (max-width: 767.98px) {
    .card-list {
        min-height: 220px;
    }
}

@media (max-width: 575.98px) {
    .card-list {
        min-height: 200px;
    }
}

.card-list .card-body {
    position: relative;
    padding: 1.5rem;
}

@media (max-width: 767.98px) {
    .card-list .card-body {
        padding: 1.25rem !important;
    }
}

@media (max-width: 575.98px) {
    .card-list .card-body {
        padding: 1rem !important;
    }
}

.card-list:hover.card {
    box-shadow: 0 0.01rem 0.25rem 0.02rem rgba(0, 0, 0, 0.075);
}

.card-list-finding-sol {
    height: 200px !important;
    background: radial-gradient(163.87% 338.51% at 12.79% 11.86%, rgba(255, 255, 255, 0) 0%, var(--surface-2) 100%), var(--surface);
    border: 1px solid var(--border-color);
    border-radius: 16px;
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: auto;
    transition: all 0.3s linear;
    overflow: hidden;
}

    .card-list-finding-sol .card-title {
        line-height: 30px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        margin-bottom: 20px;
    }

@media (max-width: 767.98px) {
    .card-list-finding-sol .card-title {
        font-size: 20px !important;
        line-height: 26px;
    }
}

@media (max-width: 575.98px) {
    .card-list-finding-sol .card-title {
        font-size: 18px !important;
        line-height: 24px;
    }
}

.card-list-finding-sol .read-more {
    display: inline-block;
    margin-top: 12px;
    transform: translateY(20px);
    opacity: 0;
    transition: transform 0.4s ease, opacity 0.4s ease;
    position: relative;
}

    .card-list-finding-sol .read-more::after {
        position: absolute;
        content: "";
        background-image: url(../../assets/images/read-more-double-arrow.svg);
        background-repeat: no-repeat;
        background-size: cover;
        width: 12px;
        height: 12px;
        top: 55%;
        transform: translateY(-50%);
        inset-inline-end: -23px;
    }

.card-list-finding-sol .card-text {
    line-height: 28px;
    transform: translateY(0);
    opacity: 1;
    transition: transform 0.4s ease, opacity 0.4s ease;
    color: var(--text-muted);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 84px;
}

@media (max-width: 767.98px) {
    .card-list-finding-sol .card-text {
        font-size: 16px !important;
        line-height: 22px;
    }
}

@media (max-width: 575.98px) {
    .card-list-finding-sol .card-text {
        font-size: 14px !important;
        line-height: 20px;
    }
}

@media (max-width: 991.98px) {
    .card-list-finding-sol {
        height: auto !important;
        min-height: 200px;
    }
}

@media (max-width: 767.98px) {
    .card-list-finding-sol {
        min-height: 160px;
    }
}

@media (max-width: 575.98px) {
    .card-list-finding-sol {
        min-height: 160px;
    }
}

.card-list-finding-sol .card-body {
    position: relative;
    padding: 32px !important;
}

@media (max-width: 767.98px) {
    .card-list-finding-sol .card-body {
        padding: 1.25rem !important;
    }
}

@media (max-width: 575.98px) {
    .card-list-finding-sol .card-body {
        padding: 1rem !important;
    }
}

.card-list-finding-sol:hover.card {
    border-radius: 16px;
    border: 1px solid rgba(61, 18, 107, 0.36);
    background: linear-gradient(100deg, rgba(61, 18, 107, 0) 40.15%, rgba(61, 18, 107, 0.19) 129.67%), radial-gradient(376.09% 188.2% at 12.79% 11.86%, rgba(255, 255, 255, 0) 0%, var(--surface-2) 100%), var(--surface);
}

.card-list-finding-sol:hover .card-text {
    transform: translateY(20px);
    opacity: 0;
}

.card-list-finding-sol:hover .read-more {
    transform: translateY(-40px);
    opacity: 1;
}

.counter-container {
    height: 100%;
}

@media (max-width: 767.98px) {
    .counter-container {
        align-items: start !important;
    }
}

.counter-container .counter {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 136px;
    font-size: clamp(50px, 35.7142857143px + 4.4642857143vw, 70px);
    color: var(--purple);
    font-weight: 500;
}

@media (min-width: 768px) {
    .counter-container .counter {
        font-size: clamp(70px, 70px + 0vw, 70px);
    }
}

@media (min-width: 1200px) {
    .counter-container .counter {
        font-size: clamp(70px, -40px + 9.1666666667vw, 136px);
    }
}

@media (max-width: 767.98px) {
    .counter-container .counter {
        font-size: 80px !important;
    }
}

@media (max-width: 991.98px) {
    .counter-container .counter {
        font-size: 100px !important;
    }
}

[dir=rtl] .counter-container .counter {
    direction: ltr;
}

.counter-container .digit-wrapper {
    overflow: hidden;
    height: 1.3em;
    line-height: 1.2;
}

.counter-container .digits {
    display: flex;
    flex-direction: column;
    transition: transform 0.8s ease-in-out;
}

    .counter-container .digits span {
        display: block;
        text-align: center;
        background: linear-gradient(90deg, var(--violet) 0%, #7444B3 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        color: transparent;
    }

.counter-container .counter-text {
    position: relative;
    z-index: -1;
    text-align: center;
}

    .counter-container .counter-text p {
        opacity: 1;
    }

@keyframes slideUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0px);
    }
}

@keyframes slideDown {
    from {
        opacity: 1;
        transform: translateY(0);
    }

    to {
        opacity: 0;
        transform: translateY(-30px);
    }
}

.discover {
    position: relative;
    overflow: hidden;
}

    .discover .counter-num h1 {
        transform: translateY(0);
        transition: transform 0.3s ease-in-out;
    }

.counterSwiper {
    height: 250px;
}

    .counterSwiper .swiper-slide {
        display: flex;
        justify-content: center;
        align-items: center;
    }

        .counterSwiper .swiper-slide.swiper-slide-active .counter-text p {
            opacity: 1;
            transform: translateY(0px);
            animation: slideUp 1s ease-in forwards;
        }

        .counterSwiper .swiper-slide.swiper-slide-prev .counter-text p {
            opacity: 1;
            transform: translateY(0px);
            animation: slideDown 1s ease-in forwards;
        }

.start-business .btn-transparent {
    position: relative;
    transition: padding 0.35s ease, background 0.35s ease, color 0.35s ease;
}

    .start-business .btn-transparent::before {
        display: none;
    }

.start-business .setup .btn-transparent {
    padding-inline: 20px !important;
}

.start-business .setup .btn.btn-transparent {
    background: var(--surface);
    color: var(--purple);
}

    .start-business .setup .btn.btn-transparent:hover {
        background: var(--violet);
        color: var(--on-primary);
    }

.start-business .setup .btn-transparent span {
    white-space: nowrap;
}

    .start-business .setup .btn-transparent span::after {
        content: "";
        display: inline-block;
        width: 0;
        height: 14px;
        opacity: 0;
        overflow: hidden;
        background: url("../images/icons/right-arrow-white.svg") no-repeat center / contain;
        flex-shrink: 0;
        align-self: center;
        margin-inline-start: 0;
        transition: width 0.35s ease, opacity 0.25s ease, margin 0.35s ease;
    }

.start-business:has(.setup .btn-transparent:hover) .setup-figure .slick-active figure img {
    scale: 1.04;
}


.start-business .btn-transparent:focus {
    background: var(--violet) !important;
    color: var(--on-primary) !important;
    padding-inline: 20px 30px !important;
}

.start-business .setup .btn-transparent:hover span::after,
.start-business .setup .btn-transparent:focus span::after {
    width: 18px;
    opacity: 1;
    margin-inline-start: 8px;
}

html[dir=rtl] .start-business:hover .setup .btn-transparent span::after,
html[dir=rtl] .start-business .setup .btn-transparent:focus span::after {
    transform: scaleX(-1);
}

@media (max-width: 767.98px) {
    .advantages .row {
        margin-bottom: 1.5rem;
    }
}

@media (max-width: 767.98px) {
    .advantages .advantage-text {
        margin-top: 1rem;
    }

        .advantages .advantage-text p {
            font-size: 18px !important;
        }
}

@media (max-width: 575.98px) {
    .advantages .advantage-text p {
        font-size: 16px !important;
    }
}

@media (max-width: 575.98px) {
    .advantages .col-sm-6.col-md-4 {
        width: 100%;
        margin-bottom: 1rem;
    }
}

@media (min-width: 576px) and (max-width: 767.98px) {
    .advantages .col-sm-6.col-md-4 {
        width: 50%;
    }
}

.advantages .card-list .card-body figure.card-image {
    position: absolute;
    bottom: 0;
    inset-inline-end: 0;
    margin: 0;
    z-index: 0;
    pointer-events: none;
    max-width: 46%;
    max-height: 52%;
    overflow: hidden;
}

.advantages .card-list {
    height: 274px !important;
}

    .advantages .card-list .card-body figure.card-image img {
        display: block;
        width: 100%;
        height: 100%;
        max-width: 100%;
        object-fit: contain;
        object-position: bottom right;
    }

@media (max-width: 575.98px) {
    .advantages .card-list .card-body figure.card-image img {
        opacity: 0.8;
    }
}

.advantages .card img {
    transition: transform 0.5s ease-in-out;
}

.advantages .card-list .card-body .advantages-first-icon figure.card-image,
.advantages .card-list .card-body .advantages-second-icon figure.card-image {
    transition: opacity 0.35s ease;
}

.advantages .card-list .card-body .advantages-second-icon figure.card-image {
    opacity: 0;
}

.advantages .card-list:hover .card-body .advantages-first-icon figure.card-image {
    opacity: 0;
}

.advantages .card-list:hover .card-body .advantages-second-icon figure.card-image {
    opacity: 1;
}

.resource-center .cardSwiper.swiper {
    padding-inline-start: var(--container-offset);
}

.resource-center .swiper-slide {
    width: 300px !important;
}

.resource-center .resource-icon-box {
    min-height: 64px !important;
    min-width: 64px !important;
    height: 64px !important;
    width: 64px !important;
}

.resource-center .cardSwiper .card {
    height: 100px !important;
}

    .resource-center .cardSwiper .card .card-body {
        display: flex;
        align-items: center;
        height: 100%;
    }

        .resource-center .cardSwiper .card .card-body > .d-flex {
            width: 100%;
        }

    .resource-center .cardSwiper .card.card-journey a.card-title {
        line-height: 1.4;
        max-width: 30ch;
        -webkit-line-clamp: 3;
        margin-bottom: 0;
    }

    .resource-center .cardSwiper .card.card-journey .arrow-icon {
        font-size: 15px;
    }

    .resource-center .cardSwiper .card.card-journey:hover .arrow-icon {
        inset-inline-end: 10px !important;
    }

@media (max-width: 767.98px) {
    .resource-center {
        margin-block: 0 !important;
        padding-top: 0 !important;
        overflow: visible !important;
    }

        .resource-center .row {
            overflow: visible !important;
        }

        .resource-center .col-12 {
            overflow: visible !important;
        }
}

.all-component-section-wrapper {
    border-top: 5px dashed var(--primary);
    border-bottom: 5px dashed var(--primary);
    padding-block: 3rem;
    margin-block: 3rem;
}

    .all-component-section-wrapper p.all-component-section-title {
        font-size: 30px;
        color: var(--primary-accent);
        font-weight: 700;
        padding-bottom: 3rem;
        border-bottom: 5px dashed var(--primary);
        margin-bottom: 3rem;
        text-align: center;
    }

/*!
* Style Sheet for ""
* version: 1
* last modified:2023 By Applab
* author: Applab
* website: www.applab.qa
*/
.alert-primary {
    --bs-alert-color: var(--bs-primary-text);
    --bs-alert-bg: var(--bs-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-primary-border-subtle);
    --bs-alert-link-color: var(--bs-primary-text);
}

.alert-white {
    --bs-alert-color: var(--bs-white-text);
    --bs-alert-bg: var(--bs-white-bg-subtle);
    --bs-alert-border-color: var(--bs-white-border-subtle);
    --bs-alert-link-color: var(--bs-white-text);
}

.alert-black {
    --bs-alert-color: var(--bs-black-text);
    --bs-alert-bg: var(--bs-black-bg-subtle);
    --bs-alert-border-color: var(--bs-black-border-subtle);
    --bs-alert-link-color: var(--bs-black-text);
}

.alert-secondary {
    --bs-alert-color: var(--bs-secondary-text);
    --bs-alert-bg: var(--bs-secondary-bg-subtle);
    --bs-alert-border-color: var(--bs-secondary-border-subtle);
    --bs-alert-link-color: var(--bs-secondary-text);
}

.alert-light-primary {
    --bs-alert-color: var(--bs-light-primary-text);
    --bs-alert-bg: var(--bs-light-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-light-primary-border-subtle);
    --bs-alert-link-color: var(--bs-light-primary-text);
}

.alert-light-bg {
    --bs-alert-color: var(--bs-light-bg-text);
    --bs-alert-bg: var(--bs-light-bg-bg-subtle);
    --bs-alert-border-color: var(--bs-light-bg-border-subtle);
    --bs-alert-link-color: var(--bs-light-bg-text);
}

.alert-grey {
    --bs-alert-color: var(--bs-grey-text);
    --bs-alert-bg: var(--bs-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-grey-border-subtle);
    --bs-alert-link-color: var(--bs-grey-text);
}

.alert-purple {
    --bs-alert-color: var(--bs-purple-text);
    --bs-alert-bg: var(--bs-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-purple-border-subtle);
    --bs-alert-link-color: var(--bs-purple-text);
}

.alert-dark-purple {
    --bs-alert-color: var(--bs-dark-purple-text);
    --bs-alert-bg: var(--bs-dark-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-purple-border-subtle);
    --bs-alert-link-color: var(--bs-dark-purple-text);
}

.alert-violet {
    --bs-alert-color: var(--bs-violet-text);
    --bs-alert-bg: var(--bs-violet-bg-subtle);
    --bs-alert-border-color: var(--bs-violet-border-subtle);
    --bs-alert-link-color: var(--bs-violet-text);
}

.alert-dark-grey {
    --bs-alert-color: var(--bs-dark-grey-text);
    --bs-alert-bg: var(--bs-dark-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-grey-border-subtle);
    --bs-alert-link-color: var(--bs-dark-grey-text);
}

.alert-light-black {
    --bs-alert-color: var(--bs-light-black-text);
    --bs-alert-bg: var(--bs-light-black-bg-subtle);
    --bs-alert-border-color: var(--bs-light-black-border-subtle);
    --bs-alert-link-color: var(--bs-light-black-text);
}

.alert-border-color {
    --bs-alert-color: var(--bs-border-color-text);
    --bs-alert-bg: var(--bs-border-color-bg-subtle);
    --bs-alert-border-color: var(--bs-border-color-border-subtle);
    --bs-alert-link-color: var(--bs-border-color-text);
}

.alert-grey1 {
    --bs-alert-color: var(--bs-grey1-text);
    --bs-alert-bg: var(--bs-grey1-bg-subtle);
    --bs-alert-border-color: var(--bs-grey1-border-subtle);
    --bs-alert-link-color: var(--bs-grey1-text);
}

.alert-grey2 {
    --bs-alert-color: var(--bs-grey2-text);
    --bs-alert-bg: var(--bs-grey2-bg-subtle);
    --bs-alert-border-color: var(--bs-grey2-border-subtle);
    --bs-alert-link-color: var(--bs-grey2-text);
}

.alert-gray-color {
    --bs-alert-color: var(--bs-gray-color-text);
    --bs-alert-bg: var(--bs-gray-color-bg-subtle);
    --bs-alert-border-color: var(--bs-gray-color-border-subtle);
    --bs-alert-link-color: var(--bs-gray-color-text);
}

.alert-gray3 {
    --bs-alert-color: var(--bs-gray3-text);
    --bs-alert-bg: var(--bs-gray3-bg-subtle);
    --bs-alert-border-color: var(--bs-gray3-border-subtle);
    --bs-alert-link-color: var(--bs-gray3-text);
}

.alert-light-grey {
    --bs-alert-color: var(--bs-light-grey-text);
    --bs-alert-bg: var(--bs-light-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-light-grey-border-subtle);
    --bs-alert-link-color: var(--bs-light-grey-text);
}

.bg-primary {
    background: var(--primary) !important;
}

.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
    }

.btn-outline-primary {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary-accent);
}

    .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
        box-shadow: none;
        outline: none;
    }

.text-primary {
    color: var(--primary-accent) !important;
}

.bg-white {
    background: var(--surface) !important;
}

.btn-white {
    background: var(--surface);
    border-color: var(--on-primary);
}

    .btn-white:hover, .btn-white:focus, .btn-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
    }

.btn-outline-white {
    background: transparent;
    border-color: var(--on-primary);
    color: var(--on-primary);
}

    .btn-outline-white:hover, .btn-outline-white:focus, .btn-outline-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
        box-shadow: none;
        outline: none;
    }

.text-white {
    color: var(--on-primary) !important;
}

.bg-black {
    background: var(--black) !important;
}

.btn-black {
    background: var(--black);
    border-color: var(--black);
}

    .btn-black:hover, .btn-black:focus, .btn-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
    }

.btn-outline-black {
    background: transparent;
    border-color: var(--black);
    color: var(--text);
}

    .btn-outline-black:hover, .btn-outline-black:focus, .btn-outline-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
        box-shadow: none;
        outline: none;
    }

.text-black {
    color: var(--text) !important;
}

.bg-secondary {
    background: var(--text-muted) !important;
}

.btn-secondary {
    background: var(--text-muted);
    border-color: var(--text-muted);
}

    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
    }

.btn-outline-secondary {
    background: transparent;
    border-color: var(--text-muted);
    color: var(--text-muted);
}

    .btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
        box-shadow: none;
        outline: none;
    }

.text-secondary {
    color: var(--text-muted) !important;
}

.bg-light-primary {
    background: var(--light-primary) !important;
}

.btn-light-primary {
    background: var(--light-primary);
    border-color: var(--light-primary);
}

    .btn-light-primary:hover, .btn-light-primary:focus, .btn-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
    }

.btn-outline-light-primary {
    background: transparent;
    border-color: var(--light-primary);
    color: var(--light-primary);
}

    .btn-outline-light-primary:hover, .btn-outline-light-primary:focus, .btn-outline-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
        box-shadow: none;
        outline: none;
    }

.text-light-primary {
    color: var(--light-primary) !important;
}

.bg-light-bg {
    background: var(--light-bg) !important;
}

.btn-light-bg {
    background: var(--light-bg);
    border-color: var(--light-bg);
}

    .btn-light-bg:hover, .btn-light-bg:focus, .btn-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
    }

.btn-outline-light-bg {
    background: transparent;
    border-color: var(--light-bg);
    color: var(--light-bg);
}

    .btn-outline-light-bg:hover, .btn-outline-light-bg:focus, .btn-outline-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
        box-shadow: none;
        outline: none;
    }

.text-light-bg {
    color: var(--light-bg) !important;
}

.bg-grey {
    background: var(--grey) !important;
}

.btn-grey {
    background: var(--grey);
    border-color: var(--grey);
}

    .btn-grey:hover, .btn-grey:focus, .btn-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
    }

.btn-outline-grey {
    background: transparent;
    border-color: var(--grey);
    color: var(--grey);
}

    .btn-outline-grey:hover, .btn-outline-grey:focus, .btn-outline-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
        box-shadow: none;
        outline: none;
    }

.text-grey {
    color: var(--grey) !important;
}

.bg-purple {
    background: var(--purple) !important;
}

.btn-purple {
    background: var(--purple);
    border-color: var(--purple);
}

    .btn-purple:hover, .btn-purple:focus, .btn-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
    }

.btn-outline-purple {
    background: transparent;
    border-color: var(--purple);
    color: var(--purple);
}

    .btn-outline-purple:hover, .btn-outline-purple:focus, .btn-outline-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
        box-shadow: none;
        outline: none;
    }

.text-purple {
    color: var(--purple) !important;
}

.bg-dark-purple {
    background: var(--dark-purple) !important;
}

.btn-dark-purple {
    background: var(--dark-purple);
    border-color: var(--dark-purple);
}

    .btn-dark-purple:hover, .btn-dark-purple:focus, .btn-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
    }

.btn-outline-dark-purple {
    background: transparent;
    border-color: var(--dark-purple);
    color: var(--dark-purple);
}

    .btn-outline-dark-purple:hover, .btn-outline-dark-purple:focus, .btn-outline-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
        box-shadow: none;
        outline: none;
    }

.text-dark-purple {
    color: var(--dark-purple) !important;
}

.bg-violet {
    background: var(--violet) !important;
}

.btn-violet {
    background: var(--violet);
    border-color: var(--violet);
}

    .btn-violet:hover, .btn-violet:focus, .btn-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
    }

.btn-outline-violet {
    background: transparent;
    border-color: var(--violet);
    color: var(--primary-accent);
}

    .btn-outline-violet:hover, .btn-outline-violet:focus, .btn-outline-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
        box-shadow: none;
        outline: none;
    }

.text-violet {
    color: var(--primary-accent) !important;
}

.bg-dark-grey {
    background: var(--dark-grey) !important;
}

.btn-dark-grey {
    background: var(--dark-grey);
    border-color: var(--dark-grey);
}

    .btn-dark-grey:hover, .btn-dark-grey:focus, .btn-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
    }

.btn-outline-dark-grey {
    background: transparent;
    border-color: var(--dark-grey);
    color: var(--dark-grey);
}

    .btn-outline-dark-grey:hover, .btn-outline-dark-grey:focus, .btn-outline-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
        box-shadow: none;
        outline: none;
    }

.text-dark-grey {
    color: var(--dark-grey) !important;
}

.bg-light-black {
    background: var(--light-black) !important;
}

.btn-light-black {
    background: var(--light-black);
    border-color: var(--light-black);
}

    .btn-light-black:hover, .btn-light-black:focus, .btn-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
    }

.btn-outline-light-black {
    background: transparent;
    border-color: var(--light-black);
    color: var(--light-black);
}

    .btn-outline-light-black:hover, .btn-outline-light-black:focus, .btn-outline-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
        box-shadow: none;
        outline: none;
    }

.text-light-black {
    color: var(--light-black) !important;
}

.bg-border-color {
    background: var(--border-color) !important;
}

.btn-border-color {
    background: var(--border-color);
    border-color: var(--border-color);
}

    .btn-border-color:hover, .btn-border-color:focus, .btn-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
    }

.btn-outline-border-color {
    background: transparent;
    border-color: var(--border-color);
    color: var(--border-color);
}

    .btn-outline-border-color:hover, .btn-outline-border-color:focus, .btn-outline-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
        box-shadow: none;
        outline: none;
    }

.text-border-color {
    color: var(--border-color) !important;
}

.bg-grey1 {
    background: var(--grey1) !important;
}

.btn-grey1 {
    background: var(--grey1);
    border-color: var(--grey1);
}

    .btn-grey1:hover, .btn-grey1:focus, .btn-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
    }

.btn-outline-grey1 {
    background: transparent;
    border-color: var(--grey1);
    color: var(--grey1);
}

    .btn-outline-grey1:hover, .btn-outline-grey1:focus, .btn-outline-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
        box-shadow: none;
        outline: none;
    }

.text-grey1 {
    color: var(--grey1) !important;
}

.bg-grey2 {
    background: var(--grey2) !important;
}

.btn-grey2 {
    background: var(--grey2);
    border-color: var(--grey2);
}

    .btn-grey2:hover, .btn-grey2:focus, .btn-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
    }

.btn-outline-grey2 {
    background: transparent;
    border-color: var(--grey2);
    color: var(--grey2);
}

    .btn-outline-grey2:hover, .btn-outline-grey2:focus, .btn-outline-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
        box-shadow: none;
        outline: none;
    }

.text-grey2 {
    color: var(--grey2) !important;
}

.bg-gray-color {
    background: var(--gray-color) !important;
}

.btn-gray-color {
    background: var(--gray-color);
    border-color: var(--gray-color);
}

    .btn-gray-color:hover, .btn-gray-color:focus, .btn-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
    }

.btn-outline-gray-color {
    background: transparent;
    border-color: var(--gray-color);
    color: var(--gray-color);
}

    .btn-outline-gray-color:hover, .btn-outline-gray-color:focus, .btn-outline-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
        box-shadow: none;
        outline: none;
    }

.text-gray-color {
    color: var(--gray-color) !important;
}

.bg-gray3 {
    background: var(--gray3) !important;
}

.btn-gray3 {
    background: var(--gray3);
    border-color: var(--gray3);
}

    .btn-gray3:hover, .btn-gray3:focus, .btn-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
    }

.btn-outline-gray3 {
    background: transparent;
    border-color: var(--gray3);
    color: var(--gray3);
}

    .btn-outline-gray3:hover, .btn-outline-gray3:focus, .btn-outline-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
        box-shadow: none;
        outline: none;
    }

.text-gray3 {
    color: var(--gray3) !important;
}

.bg-light-grey {
    background: var(--light-grey) !important;
}

.btn-light-grey {
    background: var(--light-grey);
    border-color: var(--light-grey);
}

    .btn-light-grey:hover, .btn-light-grey:focus, .btn-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
    }

.btn-outline-light-grey {
    background: transparent;
    border-color: var(--light-grey);
    color: var(--light-grey);
}

    .btn-outline-light-grey:hover, .btn-outline-light-grey:focus, .btn-outline-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
        box-shadow: none;
        outline: none;
    }

.text-light-grey {
    color: var(--light-grey) !important;
}

.fs-56 {
    font-size: clamp(30px, 30px + 0vw, 30px);
}

@media (min-width: 768px) {
    .fs-56 {
        font-size: clamp(30px, 30px + 0vw, 30px);
    }
}

@media (min-width: 1200px) {
    .fs-56 {
        font-size: clamp(30px, -13.3333333333px + 3.6111111111vw, 56px);
    }
}

.fs-40 {
    font-size: clamp(18px, 13.7142857143px + 1.3392857143vw, 24px);
}

@media (min-width: 768px) {
    .fs-40 {
        font-size: clamp(24px, 24px + 0vw, 24px);
    }
}

@media (min-width: 1200px) {
    .fs-40 {
        font-size: clamp(24px, -2.6666666667px + 2.2222222222vw, 40px);
    }
}

.fs-38 {
    font-size: clamp(18px, 15.1428571429px + 0.8928571429vw, 22px);
}

@media (min-width: 768px) {
    .fs-38 {
        font-size: clamp(22px, 22px + 0vw, 22px);
    }
}

@media (min-width: 1200px) {
    .fs-38 {
        font-size: clamp(22px, -4.6666666667px + 2.2222222222vw, 38px);
    }
}

.fs-32 {
    font-size: clamp(18px, 16.5714285714px + 0.4464285714vw, 20px);
}

@media (min-width: 768px) {
    .fs-32 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .fs-32 {
        font-size: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.fs-28 {
    font-size: clamp(16px, 14.5714285714px + 0.4464285714vw, 18px);
}

@media (min-width: 768px) {
    .fs-28 {
        font-size: clamp(18px, 18px + 0vw, 18px);
    }
}

@media (min-width: 1200px) {
    .fs-28 {
        font-size: clamp(18px, 1.3333333333px + 1.3888888889vw, 28px);
    }
}

.fs-24 {
    font-size: clamp(16px, 16px + 0vw, 16px);
}

@media (min-width: 768px) {
    .fs-24 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-24 {
        font-size: clamp(16px, 2.6666666667px + 1.1111111111vw, 24px);
    }
}

.fs-22 {
    font-size: clamp(14px, 12.5714285714px + 0.4464285714vw, 16px);
}

@media (min-width: 768px) {
    .fs-22 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-22 {
        font-size: clamp(16px, 6px + 0.8333333333vw, 22px);
    }
}

.fs-20 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-20 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-20 {
        font-size: clamp(12px, -1.3333333333px + 1.1111111111vw, 20px);
    }
}

.fs-18 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-18 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-18 {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

.fs-16 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-16 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-16 {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

.fs-15 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-15 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-15 {
        font-size: clamp(12px, 7px + 0.4166666667vw, 15px);
    }
}

.fs-14 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-14 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-14 {
        font-size: clamp(10px, 3.3333333333px + 0.5555555556vw, 14px);
    }
}

.fs-12 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-12 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-12 {
        font-size: clamp(10px, 6.6666666667px + 0.2777777778vw, 12px);
    }
}

.not-found-page {
    padding: 120px;
}

    .not-found-page figure {
        margin-bottom: 64px;
    }

    .not-found-page p {
        margin-bottom: 40px;
    }

    .not-found-page .btn {
        line-height: 1;
        background: linear-gradient(90deg, var(--violet) 0%, var(--purple) 100%);
        border-radius: 72px;
        font-family: var(--primary-font);
        font-style: normal;
        font-weight: 500;
        font-size: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--on-primary);
        text-align: center;
        position: relative;
        overflow: hidden;
        cursor: pointer;
        transition: none;
        width: 175px;
    }

        .not-found-page .btn i {
            font-size: 9px;
            color: var(--on-primary);
            display: none;
            align-items: center;
        }

@media (max-width: 767.98px) {
    .not-found-page .btn {
        font-size: 12px !important;
    }
}

@media (min-width: 992px) and (max-width: 1400px) {
    .not-found-page .btn {
        font-size: 12px !important;
    }
}

.not-found-page .btn span {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: none;
    transform: none;
}

    .not-found-page .btn span i {
        opacity: 1;
        transition: opacity 0.35s ease, transform 0.35s ease;
        display: none;
    }

.not-found-page .btn:hover {
    background: linear-gradient(-93.64deg, var(--primary) -23.72%, var(--purple) 82.41%);
}

    .not-found-page .btn:hover span i {
        opacity: 0;
        transform: translateX(500%);
    }

html[dir=rtl] .not-found-page .btn:hover span i {
    transform: translateX(-500%);
}

.not-found-page .btn:hover span::before {
    opacity: 1;
}

/*!
* Style Sheet for ""
* version: 1
* last modified:2023 By Applab
* author: Applab
* website: www.applab.qa
*/
.alert-primary {
    --bs-alert-color: var(--bs-primary-text);
    --bs-alert-bg: var(--bs-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-primary-border-subtle);
    --bs-alert-link-color: var(--bs-primary-text);
}

.alert-white {
    --bs-alert-color: var(--bs-white-text);
    --bs-alert-bg: var(--bs-white-bg-subtle);
    --bs-alert-border-color: var(--bs-white-border-subtle);
    --bs-alert-link-color: var(--bs-white-text);
}

.alert-black {
    --bs-alert-color: var(--bs-black-text);
    --bs-alert-bg: var(--bs-black-bg-subtle);
    --bs-alert-border-color: var(--bs-black-border-subtle);
    --bs-alert-link-color: var(--bs-black-text);
}

.alert-secondary {
    --bs-alert-color: var(--bs-secondary-text);
    --bs-alert-bg: var(--bs-secondary-bg-subtle);
    --bs-alert-border-color: var(--bs-secondary-border-subtle);
    --bs-alert-link-color: var(--bs-secondary-text);
}

.alert-light-primary {
    --bs-alert-color: var(--bs-light-primary-text);
    --bs-alert-bg: var(--bs-light-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-light-primary-border-subtle);
    --bs-alert-link-color: var(--bs-light-primary-text);
}

.alert-light-bg {
    --bs-alert-color: var(--bs-light-bg-text);
    --bs-alert-bg: var(--bs-light-bg-bg-subtle);
    --bs-alert-border-color: var(--bs-light-bg-border-subtle);
    --bs-alert-link-color: var(--bs-light-bg-text);
}

.alert-grey {
    --bs-alert-color: var(--bs-grey-text);
    --bs-alert-bg: var(--bs-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-grey-border-subtle);
    --bs-alert-link-color: var(--bs-grey-text);
}

.alert-purple {
    --bs-alert-color: var(--bs-purple-text);
    --bs-alert-bg: var(--bs-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-purple-border-subtle);
    --bs-alert-link-color: var(--bs-purple-text);
}

.alert-dark-purple {
    --bs-alert-color: var(--bs-dark-purple-text);
    --bs-alert-bg: var(--bs-dark-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-purple-border-subtle);
    --bs-alert-link-color: var(--bs-dark-purple-text);
}

.alert-violet {
    --bs-alert-color: var(--bs-violet-text);
    --bs-alert-bg: var(--bs-violet-bg-subtle);
    --bs-alert-border-color: var(--bs-violet-border-subtle);
    --bs-alert-link-color: var(--bs-violet-text);
}

.alert-dark-grey {
    --bs-alert-color: var(--bs-dark-grey-text);
    --bs-alert-bg: var(--bs-dark-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-grey-border-subtle);
    --bs-alert-link-color: var(--bs-dark-grey-text);
}

.alert-light-black {
    --bs-alert-color: var(--bs-light-black-text);
    --bs-alert-bg: var(--bs-light-black-bg-subtle);
    --bs-alert-border-color: var(--bs-light-black-border-subtle);
    --bs-alert-link-color: var(--bs-light-black-text);
}

.alert-border-color {
    --bs-alert-color: var(--bs-border-color-text);
    --bs-alert-bg: var(--bs-border-color-bg-subtle);
    --bs-alert-border-color: var(--bs-border-color-border-subtle);
    --bs-alert-link-color: var(--bs-border-color-text);
}

.alert-grey1 {
    --bs-alert-color: var(--bs-grey1-text);
    --bs-alert-bg: var(--bs-grey1-bg-subtle);
    --bs-alert-border-color: var(--bs-grey1-border-subtle);
    --bs-alert-link-color: var(--bs-grey1-text);
}

.alert-grey2 {
    --bs-alert-color: var(--bs-grey2-text);
    --bs-alert-bg: var(--bs-grey2-bg-subtle);
    --bs-alert-border-color: var(--bs-grey2-border-subtle);
    --bs-alert-link-color: var(--bs-grey2-text);
}

.alert-gray-color {
    --bs-alert-color: var(--bs-gray-color-text);
    --bs-alert-bg: var(--bs-gray-color-bg-subtle);
    --bs-alert-border-color: var(--bs-gray-color-border-subtle);
    --bs-alert-link-color: var(--bs-gray-color-text);
}

.alert-gray3 {
    --bs-alert-color: var(--bs-gray3-text);
    --bs-alert-bg: var(--bs-gray3-bg-subtle);
    --bs-alert-border-color: var(--bs-gray3-border-subtle);
    --bs-alert-link-color: var(--bs-gray3-text);
}

.alert-light-grey {
    --bs-alert-color: var(--bs-light-grey-text);
    --bs-alert-bg: var(--bs-light-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-light-grey-border-subtle);
    --bs-alert-link-color: var(--bs-light-grey-text);
}

.bg-primary {
    background: var(--primary) !important;
}

.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
    }

.btn-outline-primary {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary-accent);
}

    .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
        box-shadow: none;
        outline: none;
    }

.text-primary {
    color: var(--primary-accent) !important;
}

.bg-white {
    background: var(--surface) !important;
}

.btn-white {
    background: var(--surface);
    border-color: var(--on-primary);
}

    .btn-white:hover, .btn-white:focus, .btn-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
    }

.btn-outline-white {
    background: transparent;
    border-color: var(--on-primary);
    color: var(--on-primary);
}

    .btn-outline-white:hover, .btn-outline-white:focus, .btn-outline-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
        box-shadow: none;
        outline: none;
    }

.text-white {
    color: var(--on-primary) !important;
}

.bg-black {
    background: var(--black) !important;
}

.btn-black {
    background: var(--black);
    border-color: var(--black);
}

    .btn-black:hover, .btn-black:focus, .btn-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
    }

.btn-outline-black {
    background: transparent;
    border-color: var(--black);
    color: var(--text);
}

    .btn-outline-black:hover, .btn-outline-black:focus, .btn-outline-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
        box-shadow: none;
        outline: none;
    }

.text-black {
    color: var(--text) !important;
}

.bg-secondary {
    background: var(--text-muted) !important;
}

.btn-secondary {
    background: var(--text-muted);
    border-color: var(--text-muted);
}

    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
    }

.btn-outline-secondary {
    background: transparent;
    border-color: var(--text-muted);
    color: var(--text-muted);
}

    .btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
        box-shadow: none;
        outline: none;
    }

.text-secondary {
    color: var(--text-muted) !important;
}

.bg-light-primary {
    background: var(--light-primary) !important;
}

.btn-light-primary {
    background: var(--light-primary);
    border-color: var(--light-primary);
}

    .btn-light-primary:hover, .btn-light-primary:focus, .btn-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
    }

.btn-outline-light-primary {
    background: transparent;
    border-color: var(--light-primary);
    color: var(--light-primary);
}

    .btn-outline-light-primary:hover, .btn-outline-light-primary:focus, .btn-outline-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
        box-shadow: none;
        outline: none;
    }

.text-light-primary {
    color: var(--light-primary) !important;
}

.bg-light-bg {
    background: var(--light-bg) !important;
}

.btn-light-bg {
    background: var(--light-bg);
    border-color: var(--light-bg);
}

    .btn-light-bg:hover, .btn-light-bg:focus, .btn-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
    }

.btn-outline-light-bg {
    background: transparent;
    border-color: var(--light-bg);
    color: var(--light-bg);
}

    .btn-outline-light-bg:hover, .btn-outline-light-bg:focus, .btn-outline-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
        box-shadow: none;
        outline: none;
    }

.text-light-bg {
    color: var(--light-bg) !important;
}

.bg-grey {
    background: var(--grey) !important;
}

.btn-grey {
    background: var(--grey);
    border-color: var(--grey);
}

    .btn-grey:hover, .btn-grey:focus, .btn-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
    }

.btn-outline-grey {
    background: transparent;
    border-color: var(--grey);
    color: var(--grey);
}

    .btn-outline-grey:hover, .btn-outline-grey:focus, .btn-outline-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
        box-shadow: none;
        outline: none;
    }

.text-grey {
    color: var(--grey) !important;
}

.bg-purple {
    background: var(--purple) !important;
}

.btn-purple {
    background: var(--purple);
    border-color: var(--purple);
}

    .btn-purple:hover, .btn-purple:focus, .btn-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
    }

.btn-outline-purple {
    background: transparent;
    border-color: var(--purple);
    color: var(--purple);
}

    .btn-outline-purple:hover, .btn-outline-purple:focus, .btn-outline-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
        box-shadow: none;
        outline: none;
    }

.text-purple {
    color: var(--purple) !important;
}

.bg-dark-purple {
    background: var(--dark-purple) !important;
}

.btn-dark-purple {
    background: var(--dark-purple);
    border-color: var(--dark-purple);
}

    .btn-dark-purple:hover, .btn-dark-purple:focus, .btn-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
    }

.btn-outline-dark-purple {
    background: transparent;
    border-color: var(--dark-purple);
    color: var(--dark-purple);
}

    .btn-outline-dark-purple:hover, .btn-outline-dark-purple:focus, .btn-outline-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
        box-shadow: none;
        outline: none;
    }

.text-dark-purple {
    color: var(--dark-purple) !important;
}

.bg-violet {
    background: var(--violet) !important;
}

.btn-violet {
    background: var(--violet);
    border-color: var(--violet);
}

    .btn-violet:hover, .btn-violet:focus, .btn-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
    }

.btn-outline-violet {
    background: transparent;
    border-color: var(--violet);
    color: var(--primary-accent);
}

    .btn-outline-violet:hover, .btn-outline-violet:focus, .btn-outline-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
        box-shadow: none;
        outline: none;
    }

.text-violet {
    color: var(--primary-accent) !important;
}

.bg-dark-grey {
    background: var(--dark-grey) !important;
}

.btn-dark-grey {
    background: var(--dark-grey);
    border-color: var(--dark-grey);
}

    .btn-dark-grey:hover, .btn-dark-grey:focus, .btn-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
    }

.btn-outline-dark-grey {
    background: transparent;
    border-color: var(--dark-grey);
    color: var(--dark-grey);
}

    .btn-outline-dark-grey:hover, .btn-outline-dark-grey:focus, .btn-outline-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
        box-shadow: none;
        outline: none;
    }

.text-dark-grey {
    color: var(--dark-grey) !important;
}

.bg-light-black {
    background: var(--light-black) !important;
}

.btn-light-black {
    background: var(--light-black);
    border-color: var(--light-black);
}

    .btn-light-black:hover, .btn-light-black:focus, .btn-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
    }

.btn-outline-light-black {
    background: transparent;
    border-color: var(--light-black);
    color: var(--light-black);
}

    .btn-outline-light-black:hover, .btn-outline-light-black:focus, .btn-outline-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
        box-shadow: none;
        outline: none;
    }

.text-light-black {
    color: var(--light-black) !important;
}

.bg-border-color {
    background: var(--border-color) !important;
}

.btn-border-color {
    background: var(--border-color);
    border-color: var(--border-color);
}

    .btn-border-color:hover, .btn-border-color:focus, .btn-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
    }

.btn-outline-border-color {
    background: transparent;
    border-color: var(--border-color);
    color: var(--border-color);
}

    .btn-outline-border-color:hover, .btn-outline-border-color:focus, .btn-outline-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
        box-shadow: none;
        outline: none;
    }

.text-border-color {
    color: var(--border-color) !important;
}

.bg-grey1 {
    background: var(--grey1) !important;
}

.btn-grey1 {
    background: var(--grey1);
    border-color: var(--grey1);
}

    .btn-grey1:hover, .btn-grey1:focus, .btn-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
    }

.btn-outline-grey1 {
    background: transparent;
    border-color: var(--grey1);
    color: var(--grey1);
}

    .btn-outline-grey1:hover, .btn-outline-grey1:focus, .btn-outline-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
        box-shadow: none;
        outline: none;
    }

.text-grey1 {
    color: var(--grey1) !important;
}

.bg-grey2 {
    background: var(--grey2) !important;
}

.btn-grey2 {
    background: var(--grey2);
    border-color: var(--grey2);
}

    .btn-grey2:hover, .btn-grey2:focus, .btn-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
    }

.btn-outline-grey2 {
    background: transparent;
    border-color: var(--grey2);
    color: var(--grey2);
}

    .btn-outline-grey2:hover, .btn-outline-grey2:focus, .btn-outline-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
        box-shadow: none;
        outline: none;
    }

.text-grey2 {
    color: var(--grey2) !important;
}

.bg-gray-color {
    background: var(--gray-color) !important;
}

.btn-gray-color {
    background: var(--gray-color);
    border-color: var(--gray-color);
}

    .btn-gray-color:hover, .btn-gray-color:focus, .btn-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
    }

.btn-outline-gray-color {
    background: transparent;
    border-color: var(--gray-color);
    color: var(--gray-color);
}

    .btn-outline-gray-color:hover, .btn-outline-gray-color:focus, .btn-outline-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
        box-shadow: none;
        outline: none;
    }

.text-gray-color {
    color: var(--gray-color) !important;
}

.bg-gray3 {
    background: var(--gray3) !important;
}

.btn-gray3 {
    background: var(--gray3);
    border-color: var(--gray3);
}

    .btn-gray3:hover, .btn-gray3:focus, .btn-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
    }

.btn-outline-gray3 {
    background: transparent;
    border-color: var(--gray3);
    color: var(--gray3);
}

    .btn-outline-gray3:hover, .btn-outline-gray3:focus, .btn-outline-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
        box-shadow: none;
        outline: none;
    }

.text-gray3 {
    color: var(--gray3) !important;
}

.bg-light-grey {
    background: var(--light-grey) !important;
}

.btn-light-grey {
    background: var(--light-grey);
    border-color: var(--light-grey);
}

    .btn-light-grey:hover, .btn-light-grey:focus, .btn-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
    }

.btn-outline-light-grey {
    background: transparent;
    border-color: var(--light-grey);
    color: var(--light-grey);
}

    .btn-outline-light-grey:hover, .btn-outline-light-grey:focus, .btn-outline-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
        box-shadow: none;
        outline: none;
    }

.text-light-grey {
    color: var(--light-grey) !important;
}

.fs-56 {
    font-size: clamp(30px, 30px + 0vw, 30px);
}

@media (min-width: 768px) {
    .fs-56 {
        font-size: clamp(30px, 30px + 0vw, 30px);
    }
}

@media (min-width: 1200px) {
    .fs-56 {
        font-size: clamp(30px, -13.3333333333px + 3.6111111111vw, 56px);
    }
}

.fs-40 {
    font-size: clamp(18px, 13.7142857143px + 1.3392857143vw, 24px);
}

@media (min-width: 768px) {
    .fs-40 {
        font-size: clamp(24px, 24px + 0vw, 24px);
    }
}

@media (min-width: 1200px) {
    .fs-40 {
        font-size: clamp(24px, -2.6666666667px + 2.2222222222vw, 40px);
    }
}

.fs-38 {
    font-size: clamp(18px, 15.1428571429px + 0.8928571429vw, 22px);
}

@media (min-width: 768px) {
    .fs-38 {
        font-size: clamp(22px, 22px + 0vw, 22px);
    }
}

@media (min-width: 1200px) {
    .fs-38 {
        font-size: clamp(22px, -4.6666666667px + 2.2222222222vw, 38px);
    }
}

.fs-32 {
    font-size: clamp(18px, 16.5714285714px + 0.4464285714vw, 20px);
}

@media (min-width: 768px) {
    .fs-32 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .fs-32 {
        font-size: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.fs-28 {
    font-size: clamp(16px, 14.5714285714px + 0.4464285714vw, 18px);
}

@media (min-width: 768px) {
    .fs-28 {
        font-size: clamp(18px, 18px + 0vw, 18px);
    }
}

@media (min-width: 1200px) {
    .fs-28 {
        font-size: clamp(18px, 1.3333333333px + 1.3888888889vw, 28px);
    }
}

.fs-24 {
    font-size: clamp(16px, 16px + 0vw, 16px);
}

@media (min-width: 768px) {
    .fs-24 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-24 {
        font-size: clamp(16px, 2.6666666667px + 1.1111111111vw, 24px);
    }
}

.fs-22 {
    font-size: clamp(14px, 12.5714285714px + 0.4464285714vw, 16px);
}

@media (min-width: 768px) {
    .fs-22 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-22 {
        font-size: clamp(16px, 6px + 0.8333333333vw, 22px);
    }
}

.fs-20 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-20 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-20 {
        font-size: clamp(12px, -1.3333333333px + 1.1111111111vw, 20px);
    }
}

.fs-18 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-18 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-18 {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

.fs-16 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-16 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-16 {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

.fs-15 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-15 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-15 {
        font-size: clamp(12px, 7px + 0.4166666667vw, 15px);
    }
}

.fs-14 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-14 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-14 {
        font-size: clamp(10px, 3.3333333333px + 0.5555555556vw, 14px);
    }
}

.fs-12 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-12 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-12 {
        font-size: clamp(10px, 6.6666666667px + 0.2777777778vw, 12px);
    }
}

.section-title {
    text-align: start;
}

@media (max-width: 767.98px) {
    .section-title {
        margin-bottom: 24px !important;
    }
}

@media (max-width: 991.98px) {
    .section-title {
        padding-inline: 0 !important;
    }
}

.sub-title {
    text-transform: none;
    text-align: start;
    color: var(--text-muted);
}

.breadcrumb-menu {
    background-color: var(--surface-2);
    border: 1px solid var(--border-color);
    padding: 18px 0;
}

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
        content: var(--bs-breadcrumb-divider, ">");
        color: var(--purple);
        float: inline-start !important;
        padding-inline-end: var(--bs-breadcrumb-item-padding-x) !important;
    }

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item a {
        font-weight: 400;
        font-size: 16px;
        line-height: 19px;
        letter-spacing: -0.18px;
        color: var(--text-muted);
    }

        .breadcrumb-menu nav .breadcrumb .breadcrumb-item a.active {
            color: var(--purple);
        }

.simpleTabs,
#simpleTabs {
    border: 0;
}

    .simpleTabs .nav-link,
    #simpleTabs .nav-link {
        background: var(--surface);
        color: var(--dark-grey);
        border: 0;
        padding: 16px;
        font-weight: 400;
    }

        .simpleTabs .nav-link.active,
        #simpleTabs .nav-link.active {
            color: var(--primary-accent);
            border-bottom: 3px solid var(--violet);
            font-weight: 500;
        }

@media (max-width: 575.98px) {
    .simpleTabs .nav-link,
    #simpleTabs .nav-link {
        padding: 12px 8px;
        font-size: 14px !important;
    }
}

.leadership .tab-content {
    margin-top: 40px;
}

.element-card {
    padding: 18px;
    text-align: center;
    border-radius: 8px;
}

    .element-card figure {
        position: relative;
        transition: all 0.3s ease-in-out;
        max-width: 245px;
        margin: 0 auto;
    }

        .element-card figure::before {
            content: "";
            position: absolute;
            width: 100%;
            border-radius: 50%;
            z-index: -1;
            aspect-ratio: 1;
            bottom: 1px;
            left: 50%;
            transform: translateX(-50%);
        }

    .element-card img {
        aspect-ratio: 238/273;
        object-fit: cover;
        border-radius: 0 0 210px 210px !important;
    }

    .element-card h4 {
        text-align: center;
    }

    .element-card p {
        color: var(--dark-grey);
        margin-bottom: 12px;
        text-align: center;
    }

    .element-card:hover figure {
        scale: 1.05;
    }

    .element-card--static:hover figure {
        scale: 1;
    }

.offcanvas[id$="leadershipModal"] {
    width: 1000px;
    border-radius: 0;
    overflow-x: hidden;
    z-index: 99999;
}

    .offcanvas[id$="leadershipModal"]::before {
        content: '';
        position: absolute;
        top: -71px;
        right: 8px;
        width: 100%;
        height: 100%;
        background-image: url('/_QFC_Assets/assets/images/layout_pattern.png');
        background-repeat: no-repeat;
        background-position: calc(100% + 180px) top;
        background-size: auto;
        pointer-events: none;
        z-index: 0;
    }

    .offcanvas[id$="leadershipModal"] .offcanvas-header,
    .offcanvas[id$="leadershipModal"] .offcanvas-body {
        position: relative;
        z-index: 1;
    }

@media (min-width: 1200px) {
    .offcanvas[id$="leadershipModal"] {
        height: 100vh;
    }
}

.offcanvas[id$="leadershipModal"].designated-location-modal {
    width: 50%;
}

@media only screen and (max-width: 575.98px) {
    .offcanvas[id$="leadershipModal"].designated-location-modal {
        width: 100%;
    }
}

.offcanvas[id$="leadershipModal"] .offcanvas-header {
    padding-block-end: 0;
}

    .offcanvas[id$="leadershipModal"] .offcanvas-header .btn-close {
        border: 1px solid var(--secondary);
        padding: 16px;
        border-radius: 50%;
        background: none;
        background-color: var(--surface);
        opacity: 1;
        display: flex;
        align-items: center;
    }

        .offcanvas[id$="leadershipModal"] .offcanvas-header .btn-close::after {
            content: "";
            display: inline-block;
            background-color: var(--violet);
            mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");
            background-image: none;
            mask-repeat: no-repeat;
            mask-size: 12px;
            mask-position: center center;
            width: 100%;
            height: 100%;
        }

        .offcanvas[id$="leadershipModal"] .offcanvas-header .btn-close:hover {
            background-color: var(--violet);
        }

            .offcanvas[id$="leadershipModal"] .offcanvas-header .btn-close:hover::after {
                background-color: var(--surface);
            }

.offcanvas[id$="leadershipModal"] .offcanvas-body {
    padding-inline: 50px;
    padding-block-start: 0;
    position: relative;
}

@media (max-width: 767.98px) {
    .offcanvas[id$="leadershipModal"] .offcanvas-body {
        padding-inline: 15px;
    }
}

.offcanvas[id$="leadershipModal"] .offcanvas-body .element-card h3, .offcanvas[id$="leadershipModal"] .offcanvas-body .element-card h5, .offcanvas[id$="leadershipModal"] .offcanvas-body .element-card p {
    text-align: start;
}

.offcanvas[id$="leadershipModal"] .offcanvas-body .element-card .col-md-8 {
    place-content: center;
    margin-top: 24px;
}

@media (max-width: 767.98px) {
    .offcanvas[id$="leadershipModal"] .offcanvas-body .element-card h3, .offcanvas[id$="leadershipModal"] .offcanvas-body .element-card h5 {
        text-align: center;
    }
}

/*!
* Style Sheet for ""
* version: 1
* last modified:2023 By Applab
* author: Applab
* website: www.applab.qa
*/
.qfca-content .item.active h4 {
    font-weight: bold;
}

.alert-primary {
    --bs-alert-color: var(--bs-primary-text);
    --bs-alert-bg: var(--bs-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-primary-border-subtle);
    --bs-alert-link-color: var(--bs-primary-text);
}

.alert-white {
    --bs-alert-color: var(--bs-white-text);
    --bs-alert-bg: var(--bs-white-bg-subtle);
    --bs-alert-border-color: var(--bs-white-border-subtle);
    --bs-alert-link-color: var(--bs-white-text);
}

.alert-black {
    --bs-alert-color: var(--bs-black-text);
    --bs-alert-bg: var(--bs-black-bg-subtle);
    --bs-alert-border-color: var(--bs-black-border-subtle);
    --bs-alert-link-color: var(--bs-black-text);
}

.alert-secondary {
    --bs-alert-color: var(--bs-secondary-text);
    --bs-alert-bg: var(--bs-secondary-bg-subtle);
    --bs-alert-border-color: var(--bs-secondary-border-subtle);
    --bs-alert-link-color: var(--bs-secondary-text);
}

.alert-light-primary {
    --bs-alert-color: var(--bs-light-primary-text);
    --bs-alert-bg: var(--bs-light-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-light-primary-border-subtle);
    --bs-alert-link-color: var(--bs-light-primary-text);
}

.alert-light-bg {
    --bs-alert-color: var(--bs-light-bg-text);
    --bs-alert-bg: var(--bs-light-bg-bg-subtle);
    --bs-alert-border-color: var(--bs-light-bg-border-subtle);
    --bs-alert-link-color: var(--bs-light-bg-text);
}

.alert-grey {
    --bs-alert-color: var(--bs-grey-text);
    --bs-alert-bg: var(--bs-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-grey-border-subtle);
    --bs-alert-link-color: var(--bs-grey-text);
}

.alert-purple {
    --bs-alert-color: var(--bs-purple-text);
    --bs-alert-bg: var(--bs-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-purple-border-subtle);
    --bs-alert-link-color: var(--bs-purple-text);
}

.alert-dark-purple {
    --bs-alert-color: var(--bs-dark-purple-text);
    --bs-alert-bg: var(--bs-dark-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-purple-border-subtle);
    --bs-alert-link-color: var(--bs-dark-purple-text);
}

.alert-violet {
    --bs-alert-color: var(--bs-violet-text);
    --bs-alert-bg: var(--bs-violet-bg-subtle);
    --bs-alert-border-color: var(--bs-violet-border-subtle);
    --bs-alert-link-color: var(--bs-violet-text);
}

.alert-dark-grey {
    --bs-alert-color: var(--bs-dark-grey-text);
    --bs-alert-bg: var(--bs-dark-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-grey-border-subtle);
    --bs-alert-link-color: var(--bs-dark-grey-text);
}

.alert-light-black {
    --bs-alert-color: var(--bs-light-black-text);
    --bs-alert-bg: var(--bs-light-black-bg-subtle);
    --bs-alert-border-color: var(--bs-light-black-border-subtle);
    --bs-alert-link-color: var(--bs-light-black-text);
}

.alert-border-color {
    --bs-alert-color: var(--bs-border-color-text);
    --bs-alert-bg: var(--bs-border-color-bg-subtle);
    --bs-alert-border-color: var(--bs-border-color-border-subtle);
    --bs-alert-link-color: var(--bs-border-color-text);
}

.alert-grey1 {
    --bs-alert-color: var(--bs-grey1-text);
    --bs-alert-bg: var(--bs-grey1-bg-subtle);
    --bs-alert-border-color: var(--bs-grey1-border-subtle);
    --bs-alert-link-color: var(--bs-grey1-text);
}

.alert-grey2 {
    --bs-alert-color: var(--bs-grey2-text);
    --bs-alert-bg: var(--bs-grey2-bg-subtle);
    --bs-alert-border-color: var(--bs-grey2-border-subtle);
    --bs-alert-link-color: var(--bs-grey2-text);
}

.alert-gray-color {
    --bs-alert-color: var(--bs-gray-color-text);
    --bs-alert-bg: var(--bs-gray-color-bg-subtle);
    --bs-alert-border-color: var(--bs-gray-color-border-subtle);
    --bs-alert-link-color: var(--bs-gray-color-text);
}

.alert-gray3 {
    --bs-alert-color: var(--bs-gray3-text);
    --bs-alert-bg: var(--bs-gray3-bg-subtle);
    --bs-alert-border-color: var(--bs-gray3-border-subtle);
    --bs-alert-link-color: var(--bs-gray3-text);
}

.alert-light-grey {
    --bs-alert-color: var(--bs-light-grey-text);
    --bs-alert-bg: var(--bs-light-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-light-grey-border-subtle);
    --bs-alert-link-color: var(--bs-light-grey-text);
}

.bg-primary {
    background: var(--primary) !important;
}

.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
    }

.btn-outline-primary {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary-accent);
}

    .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
        box-shadow: none;
        outline: none;
    }

.text-primary {
    color: var(--primary-accent) !important;
}

.bg-white {
    background: var(--surface) !important;
}

.btn-white {
    background: var(--surface);
    border-color: var(--on-primary);
}

    .btn-white:hover, .btn-white:focus, .btn-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
    }

.btn-outline-white {
    background: transparent;
    border-color: var(--on-primary);
    color: var(--on-primary);
}

    .btn-outline-white:hover, .btn-outline-white:focus, .btn-outline-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
        box-shadow: none;
        outline: none;
    }

.text-white {
    color: var(--on-primary) !important;
}

.bg-black {
    background: var(--black) !important;
}

.btn-black {
    background: var(--black);
    border-color: var(--black);
}

    .btn-black:hover, .btn-black:focus, .btn-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
    }

.btn-outline-black {
    background: transparent;
    border-color: var(--black);
    color: var(--text);
}

    .btn-outline-black:hover, .btn-outline-black:focus, .btn-outline-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
        box-shadow: none;
        outline: none;
    }

.text-black {
    color: var(--text) !important;
}

.bg-secondary {
    background: var(--text-muted) !important;
}

.btn-secondary {
    background: var(--text-muted);
    border-color: var(--text-muted);
}

    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
    }

.btn-outline-secondary {
    background: transparent;
    border-color: var(--text-muted);
    color: var(--text-muted);
}

    .btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
        box-shadow: none;
        outline: none;
    }

.text-secondary {
    color: var(--text-muted) !important;
}

.bg-light-primary {
    background: var(--light-primary) !important;
}

.btn-light-primary {
    background: var(--light-primary);
    border-color: var(--light-primary);
}

    .btn-light-primary:hover, .btn-light-primary:focus, .btn-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
    }

.btn-outline-light-primary {
    background: transparent;
    border-color: var(--light-primary);
    color: var(--light-primary);
}

    .btn-outline-light-primary:hover, .btn-outline-light-primary:focus, .btn-outline-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
        box-shadow: none;
        outline: none;
    }

.text-light-primary {
    color: var(--light-primary) !important;
}

.bg-light-bg {
    background: var(--light-bg) !important;
}

.btn-light-bg {
    background: var(--light-bg);
    border-color: var(--light-bg);
}

    .btn-light-bg:hover, .btn-light-bg:focus, .btn-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
    }

.btn-outline-light-bg {
    background: transparent;
    border-color: var(--light-bg);
    color: var(--light-bg);
}

    .btn-outline-light-bg:hover, .btn-outline-light-bg:focus, .btn-outline-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
        box-shadow: none;
        outline: none;
    }

.text-light-bg {
    color: var(--light-bg) !important;
}

.bg-grey {
    background: var(--grey) !important;
}

.btn-grey {
    background: var(--grey);
    border-color: var(--grey);
}

    .btn-grey:hover, .btn-grey:focus, .btn-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
    }

.btn-outline-grey {
    background: transparent;
    border-color: var(--grey);
    color: var(--grey);
}

    .btn-outline-grey:hover, .btn-outline-grey:focus, .btn-outline-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
        box-shadow: none;
        outline: none;
    }

.text-grey {
    color: var(--grey) !important;
}

.bg-purple {
    background: var(--purple) !important;
}

.btn-purple {
    background: var(--purple);
    border-color: var(--purple);
}

    .btn-purple:hover, .btn-purple:focus, .btn-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
    }

.btn-outline-purple {
    background: transparent;
    border-color: var(--purple);
    color: var(--purple);
}

    .btn-outline-purple:hover, .btn-outline-purple:focus, .btn-outline-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
        box-shadow: none;
        outline: none;
    }

.text-purple {
    color: var(--purple) !important;
}

.bg-dark-purple {
    background: var(--dark-purple) !important;
}

.btn-dark-purple {
    background: var(--dark-purple);
    border-color: var(--dark-purple);
}

    .btn-dark-purple:hover, .btn-dark-purple:focus, .btn-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
    }

.btn-outline-dark-purple {
    background: transparent;
    border-color: var(--dark-purple);
    color: var(--dark-purple);
}

    .btn-outline-dark-purple:hover, .btn-outline-dark-purple:focus, .btn-outline-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
        box-shadow: none;
        outline: none;
    }

.text-dark-purple {
    color: var(--dark-purple) !important;
}

.bg-violet {
    background: var(--violet) !important;
}

.btn-violet {
    background: var(--violet);
    border-color: var(--violet);
}

    .btn-violet:hover, .btn-violet:focus, .btn-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
    }

.btn-outline-violet {
    background: transparent;
    border-color: var(--violet);
    color: var(--primary-accent);
}

    .btn-outline-violet:hover, .btn-outline-violet:focus, .btn-outline-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
        box-shadow: none;
        outline: none;
    }

.text-violet {
    color: var(--primary-accent) !important;
}

.bg-dark-grey {
    background: var(--dark-grey) !important;
}

.btn-dark-grey {
    background: var(--dark-grey);
    border-color: var(--dark-grey);
}

    .btn-dark-grey:hover, .btn-dark-grey:focus, .btn-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
    }

.btn-outline-dark-grey {
    background: transparent;
    border-color: var(--dark-grey);
    color: var(--dark-grey);
}

    .btn-outline-dark-grey:hover, .btn-outline-dark-grey:focus, .btn-outline-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
        box-shadow: none;
        outline: none;
    }

.text-dark-grey {
    color: var(--dark-grey) !important;
}

.bg-light-black {
    background: var(--light-black) !important;
}

.btn-light-black {
    background: var(--light-black);
    border-color: var(--light-black);
}

    .btn-light-black:hover, .btn-light-black:focus, .btn-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
    }

.btn-outline-light-black {
    background: transparent;
    border-color: var(--light-black);
    color: var(--light-black);
}

    .btn-outline-light-black:hover, .btn-outline-light-black:focus, .btn-outline-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
        box-shadow: none;
        outline: none;
    }

.text-light-black {
    color: var(--light-black) !important;
}

.bg-border-color {
    background: var(--border-color) !important;
}

.btn-border-color {
    background: var(--border-color);
    border-color: var(--border-color);
}

    .btn-border-color:hover, .btn-border-color:focus, .btn-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
    }

.btn-outline-border-color {
    background: transparent;
    border-color: var(--border-color);
    color: var(--border-color);
}

    .btn-outline-border-color:hover, .btn-outline-border-color:focus, .btn-outline-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
        box-shadow: none;
        outline: none;
    }

.text-border-color {
    color: var(--border-color) !important;
}

.bg-grey1 {
    background: var(--grey1) !important;
}

.btn-grey1 {
    background: var(--grey1);
    border-color: var(--grey1);
}

    .btn-grey1:hover, .btn-grey1:focus, .btn-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
    }

.btn-outline-grey1 {
    background: transparent;
    border-color: var(--grey1);
    color: var(--grey1);
}

    .btn-outline-grey1:hover, .btn-outline-grey1:focus, .btn-outline-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
        box-shadow: none;
        outline: none;
    }

.text-grey1 {
    color: var(--grey1) !important;
}

.bg-grey2 {
    background: var(--grey2) !important;
}

.btn-grey2 {
    background: var(--grey2);
    border-color: var(--grey2);
}

    .btn-grey2:hover, .btn-grey2:focus, .btn-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
    }

.btn-outline-grey2 {
    background: transparent;
    border-color: var(--grey2);
    color: var(--grey2);
}

    .btn-outline-grey2:hover, .btn-outline-grey2:focus, .btn-outline-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
        box-shadow: none;
        outline: none;
    }

.text-grey2 {
    color: var(--grey2) !important;
}

.bg-gray-color {
    background: var(--gray-color) !important;
}

.btn-gray-color {
    background: var(--gray-color);
    border-color: var(--gray-color);
}

    .btn-gray-color:hover, .btn-gray-color:focus, .btn-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
    }

.btn-outline-gray-color {
    background: transparent;
    border-color: var(--gray-color);
    color: var(--gray-color);
}

    .btn-outline-gray-color:hover, .btn-outline-gray-color:focus, .btn-outline-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
        box-shadow: none;
        outline: none;
    }

.text-gray-color {
    color: var(--gray-color) !important;
}

.bg-gray3 {
    background: var(--gray3) !important;
}

.btn-gray3 {
    background: var(--gray3);
    border-color: var(--gray3);
}

    .btn-gray3:hover, .btn-gray3:focus, .btn-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
    }

.btn-outline-gray3 {
    background: transparent;
    border-color: var(--gray3);
    color: var(--gray3);
}

    .btn-outline-gray3:hover, .btn-outline-gray3:focus, .btn-outline-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
        box-shadow: none;
        outline: none;
    }

.text-gray3 {
    color: var(--gray3) !important;
}

.bg-light-grey {
    background: var(--light-grey) !important;
}

.btn-light-grey {
    background: var(--light-grey);
    border-color: var(--light-grey);
}

    .btn-light-grey:hover, .btn-light-grey:focus, .btn-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
    }

.btn-outline-light-grey {
    background: transparent;
    border-color: var(--light-grey);
    color: var(--light-grey);
}

    .btn-outline-light-grey:hover, .btn-outline-light-grey:focus, .btn-outline-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
        box-shadow: none;
        outline: none;
    }

.text-light-grey {
    color: var(--light-grey) !important;
}

.fs-56 {
    font-size: clamp(30px, 30px + 0vw, 30px);
}

@media (min-width: 768px) {
    .fs-56 {
        font-size: clamp(30px, 30px + 0vw, 30px);
    }
}

@media (min-width: 1200px) {
    .fs-56 {
        font-size: clamp(30px, -13.3333333333px + 3.6111111111vw, 56px);
    }
}

.fs-40 {
    font-size: clamp(18px, 13.7142857143px + 1.3392857143vw, 24px);
}

@media (min-width: 768px) {
    .fs-40 {
        font-size: clamp(24px, 24px + 0vw, 24px);
    }
}

@media (min-width: 1200px) {
    .fs-40 {
        font-size: clamp(24px, -2.6666666667px + 2.2222222222vw, 40px);
    }
}

.fs-38 {
    font-size: clamp(18px, 15.1428571429px + 0.8928571429vw, 22px);
}

@media (min-width: 768px) {
    .fs-38 {
        font-size: clamp(22px, 22px + 0vw, 22px);
    }
}

@media (min-width: 1200px) {
    .fs-38 {
        font-size: clamp(22px, -4.6666666667px + 2.2222222222vw, 38px);
    }
}

.fs-32 {
    font-size: clamp(18px, 16.5714285714px + 0.4464285714vw, 20px);
}

@media (min-width: 768px) {
    .fs-32 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .fs-32 {
        font-size: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.fs-28 {
    font-size: clamp(16px, 14.5714285714px + 0.4464285714vw, 18px);
}

@media (min-width: 768px) {
    .fs-28 {
        font-size: clamp(18px, 18px + 0vw, 18px);
    }
}

@media (min-width: 1200px) {
    .fs-28 {
        font-size: clamp(18px, 1.3333333333px + 1.3888888889vw, 28px);
    }
}

.fs-24 {
    font-size: clamp(16px, 16px + 0vw, 16px);
}

@media (min-width: 768px) {
    .fs-24 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-24 {
        font-size: clamp(16px, 2.6666666667px + 1.1111111111vw, 24px);
    }
}

.fs-22 {
    font-size: clamp(14px, 12.5714285714px + 0.4464285714vw, 16px);
}

@media (min-width: 768px) {
    .fs-22 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-22 {
        font-size: clamp(16px, 6px + 0.8333333333vw, 22px);
    }
}

.fs-20 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-20 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-20 {
        font-size: clamp(12px, -1.3333333333px + 1.1111111111vw, 20px);
    }
}

.fs-18 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-18 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-18 {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

.fs-16 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-16 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-16 {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

.fs-15 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-15 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-15 {
        font-size: clamp(12px, 7px + 0.4166666667vw, 15px);
    }
}

.fs-14 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-14 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-14 {
        font-size: clamp(10px, 3.3333333333px + 0.5555555556vw, 14px);
    }
}

.fs-12 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-12 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-12 {
        font-size: clamp(10px, 6.6666666667px + 0.2777777778vw, 12px);
    }
}

.section-title {
    text-align: start;
}

@media (max-width: 767.98px) {
    .section-title {
        margin-bottom: 24px !important;
    }
}

@media (max-width: 991.98px) {
    .section-title {
        padding-inline: 0 !important;
    }
}

.sub-title {
    text-transform: none;
    text-align: start;
    color: var(--text-muted);
}

.breadcrumb-menu {
    background-color: var(--surface-2);
    border: 1px solid var(--border-color);
    padding: 18px 0;
}

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
        content: var(--bs-breadcrumb-divider, ">");
        color: var(--purple);
        float: inline-start !important;
        padding-inline-end: var(--bs-breadcrumb-item-padding-x) !important;
    }

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item a {
        font-weight: 400;
        font-size: 16px;
        line-height: 19px;
        letter-spacing: -0.18px;
        color: var(--text-muted);
    }

        .breadcrumb-menu nav .breadcrumb .breadcrumb-item a.active {
            color: var(--purple);
        }

.filter-items {
    padding: 16px 24px;
    border: 1px solid var(--secondary);
    height: 54px;
    border-radius: 25px;
    display: flex !important;
    align-items: center;
}

@media (max-width: 575.98px) {
    .filter-items {
        padding: 10px;
        height: 42px;
    }

        .filter-items input, .filter-items select {
            font-size: 12px !important;
        }
}

.filter-items input {
    border: 0;
    box-shadow: none;
    width: 100%;
}

    .filter-items input::placeholder {
        color: var(--primary-accent);
    }

    .filter-items input:focus {
        outline: none;
    }

.filter-items.search-box {
    display: flex;
    width: 138px;
    max-width: 100%;
    transition: width 0.3s ease-in-out;
}

    .filter-items.search-box:focus-within {
        width: 320px;
    }


.filter-items i {
    color: var(--primary-accent);
}

.filter-items select {
    border: 0;
    color: var(--primary-accent);
}

    .filter-items select:focus {
        outline: none;
    }

.filter-tabs {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.pagination {
    gap: 8px;
}

@media (max-width: 767.98px) {
    .pagination {
        gap: 4px;
    }
}

.pagination .page-item.disable {
    opacity: 0.4;
    pointer-events: none;
}

.pagination .page-item .page-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    color: var(--primary-accent);
    border-radius: 100px;
    border: 0;
}

    .pagination .page-item .page-link:focus {
        box-shadow: none;
    }

@media (max-width: 575.98px) {
    .pagination .page-item .page-link {
        width: 32px;
        height: 32px;
        font-size: 14px;
    }
}

.pagination .page-item .page-link[aria-label=Previous], .pagination .page-item .page-link[aria-label=Next] {
    border: 1px solid var(--violet);
    border-radius: 100px;
}

html[dir=rtl] .pagination .page-item .page-link[aria-label=Previous], html[dir=rtl] .pagination .page-item .page-link[aria-label=Next] {
    transform: scaleX(-1);
}

.pagination .page-item .page-link i {
    color: var(--purple);
}

    .pagination .page-item .page-link i::before {
        content: "";
        font-weight: bold;
        font-size: 18px;
        background-image: url(../../assets/images/icons/left-arrow-sm.svg);
        background-repeat: no-repeat;
        background-size: cover;
        width: 7px;
        height: 12px;
        display: block;
    }

    .pagination .page-item .page-link i.next::before {
        transform: rotate(180deg);
    }

    /* RTL: the arrow icon is a left-pointing background image; the .next arrow is
       rotated 180deg to point right. Reverse both in Arabic: prev points right,
       next points left. Keyed on the .next class the pagination JS emits. */
    html[dir=rtl] .pagination .page-item .page-link i::before {
        transform: rotate(180deg);
    }

    html[dir=rtl] .pagination .page-item .page-link i.next::before {
        transform: none;
    }

.pagination .page-item:hover .page-link {
    background-color: #EFEFEF;
}

    .pagination .page-item:hover .page-link[aria-label=Previous], .pagination .page-item:hover .page-link[aria-label=Next] {
        background: var(--surface) !important;
    }

.pagination .page-item:focus .page-link, .pagination .page-item.active .page-link {
    background-color: var(--secondary);
    color: var(--primary-accent);
    border: none;
}

    .pagination .page-item:focus .page-link img, .pagination .page-item.active .page-link img {
        filter: brightness(0) invert(1);
    }

.pagination .page-prev .page-link, .pagination .page-next .page-link {
    border: none !important;
}

.news-list-page .news-box {
    flex: 0 0 auto;
    flex-shrink: 0;
    width: 33.33333333% !important;
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) * 0.5);
    padding-left: calc(var(--bs-gutter-x) * 0.5);
    margin-top: var(--bs-gutter-y);
    margin-bottom: 56px;
    position: relative;
}

@media (max-width: 991.98px) {
    .news-list-page .news-box {
        width: 50% !important;
    }
}

@media (max-width: 575.98px) {
    .news-list-page .news-box {
        width: 100% !important;
    }
}

.news-list-page .news-box figure {
    position: relative;
    overflow: hidden;
    margin-bottom: 38px;
    border-radius: 16px;
    aspect-ratio: 3 / 2;
}

    .news-list-page .news-box figure img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: all 0.3s ease-in-out;
    }

    .news-list-page .news-box figure .label {
        position: absolute;
        inset-block-start: 16px;
        inset-inline-start: 16px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 4px 16px 5px;
        gap: 8px;
        width: max-content;
        height: 26px;
        background: rgba(229, 229, 230, 0.8);
        border-radius: 16px;
        font-weight: 400;
        color: var(--purple);
        transition: all 0.5s ease-in-out;
    }

    .news-list-page .news-box figure .date-box {
        position: absolute;
        inset-block-end: 16px;
        inset-inline-start: 16px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 8px 18px;
        background: var(--surface);
        border-radius: 10px;
    }

        .news-list-page .news-box figure .date-box h4 {
            margin: 0;
        }

        .news-list-page .news-box figure .date-box p {
            color: var(--purple);
            margin: 0;
        }

        .news-list-page .news-box figure .date-box hr {
            border-top: 0.5px solid rgba(0, 0, 0, 0.2);
            width: 49px;
            opacity: 1;
            margin: 0;
        }

.news-list-page .news-box:hover figure img {
    scale: 1.04;
}

.news-list-page .news-box .news-details h2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 3em;
}

@media (min-width: 1200px) {
    .events-page .news-box {
        width: 25% !important;
    }
}

.extra-styles .news-details {
    width: auto !important;
}

.extra-styles .news-box {
    margin-bottom: 0;
}

@media (max-width: 767.98px) {
    .updates .news-list {
        display: block !important;
    }
}

.updates .news-list .news-box {
    position: relative;
    overflow: hidden;
    cursor: pointer;
    width: calc(50% - 1rem);
}

    .updates .news-list .news-box a::before {
        content: "";
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
    }

    .updates .news-list .news-box figure {
        object-fit: contain;
        background-image: url(../../assets/images/logo.png);
        background-repeat: no-repeat;
        background-size: 80%;
        background-position: center center;
        background-color: var(--surface-3);
        transition: background-position 0.5s ease;
        width: 100%;
        height: 345px;
        border-radius: 16px;
        overflow: hidden;
        position: relative;
    }

@media (max-width: 767.98px) {
    .updates .news-list .news-box figure {
        width: 100% !important;
    }
}

.updates .news-list .news-box figure img {
    transition: all 0.3s ease-in-out;
}

.updates .news-list .news-box:hover h2, .updates .news-list .news-box:hover a {
    color: var(--purple) !important;
}

.updates .news-list .news-box:hover .date-box {
    background: var(--purple) !important;
}

    .updates .news-list .news-box:hover .date-box h4,
    .updates .news-list .news-box:hover .date-box p {
        color: var(--on-primary) !important;
    }

    .updates .news-list .news-box:hover .date-box hr {
        border-color: var(--on-primary) !important;
        opacity: 0.2;
    }

.updates .news-list .news-box:hover figure img {
    scale: 1.04;
}

.updates .news-list .news-box .label {
    position: absolute;
    inset: 16px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 4px 16px 5px;
    gap: 8px;
    width: max-content;
    height: 26px;
    background: rgba(229, 229, 230, 0.8);
    border-radius: 16px;
    font-weight: 400;
    color: var(--purple);
    transition: all 0.5s ease-in-out;
    inset-inline-start: 16px;
}

.updates .news-list .news-box .date-box {
    position: absolute;
    inset-block-end: 13px;
    inset-inline-start: 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 8px 18px;
    background: var(--surface);
    border-radius: 10px;
}

    .updates .news-list .news-box .date-box h4 {
        margin: 0;
    }

    .updates .news-list .news-box .date-box p {
        color: var(--purple);
        margin: 0;
    }

    .updates .news-list .news-box .date-box hr {
        border-top: 0.5px solid rgba(0, 0, 0, 0.2);
        width: 49px;
        opacity: 1;
        margin: 0;
    }

.updates .news-list .news-box.bordererd {
    border: 1px solid var(--border-color);
    padding: 32px;
    border-radius: 16px;
    transition: all 0.5s ease-in-out;
}

@media (max-width: 991.98px) {
    .updates .news-list .news-box.bordererd {
        padding: 10px !important;
    }
}

.updates .news-list .news-box.bordererd .label {
    position: relative;
    inset: 0;
    margin-bottom: 32px;
}

.updates .news-list .news-box.bordererd h2 {
    margin-bottom: 32px;
}

.updates .news-list .news-box.bordererd:hover {
    border-color: var(--violet);
}

    .updates .news-list .news-box.bordererd:hover .label {
        background-color: var(--violet);
        color: var(--on-primary);
    }

@media (max-width: 991.98px) {
    .updates .news-list .news-box {
        width: 100%;
    }
}

.updates .news-details {
    width: 100%;
}

    .updates .news-details p {
        font-weight: 400;
        color: var(--text-muted);
        margin-bottom: 0;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .updates .news-details i {
        font-size: 6px;
    }

        .updates .news-details i.bi-geo-alt {
            font-size: 11px;
        }

    .updates .news-details h2 {
        line-height: 34px;
        height: auto;
        overflow: hidden;
    }

@media (max-width: 575.98px) {
    .updates .news-details h2 {
        line-height: 26px;
    }
}

.updates .border-end {
    height: 84%;
    margin-top: 70px;
    border-color: var(--border);
}

@media (max-width: 767.98px) {
    .updates .border-end {
        border-top: 1px solid var(--border) !important;
        border-right: 0 !important;
        width: 75%;
    }
}

.news-details-page {
    margin-bottom: 32px;
}

    .news-details-page .news-box {
        width: 100% !important;
        max-width: 100%;
        margin-bottom: 32px;
        display: flex;
        flex-direction: column;
    }

        .news-details-page .news-box figure {
            overflow: hidden;
            margin-bottom: 32px;
            height: 600px;
            order: 1;
            border-radius: 16px;
        }

@media (max-width: 767.98px) {
    .news-details-page .news-box figure {
        height: 200px;
    }
}

.news-details-page .news-box figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.3s ease-in-out;
}

.news-details-page .news-box .label {
    position: relative;
    order: 2;
    inset: 0;
    width: fit-content;
    background-color: rgba(229, 229, 230, 0.8);
    color: var(--primary-accent);
    padding: 6px 16px;
    border-radius: 16px;
    font-weight: 600;
}

.news-details-page .news-details {
    order: 3;
    display: flex;
    flex-direction: column;
    width: 100%;
}

    .news-details-page .news-details .date-location {
        order: 2;
    }

    .news-details-page .news-details h2 {
        order: 1;
        color: var(--primary-accent) !important;
    }

.share-social-media {
    padding: 12px;
    gap: 20px;
}

.share-social-icons {
    display: flex;
    gap: 10px;
}

    .share-social-icons a {
        padding: 5px 9px;
    }

        .share-social-icons a svg {
            fill: var(--text);
            width: 14px;
            height: 14px;
        }

        .share-social-icons a img {
            width: 14px;
            height: 14px;
        }

.event-details-page .news-box label {
    margin-bottom: 24px;
}

.event-details-page .news-details {
    width: 66.66666667%;
}

    .event-details-page .news-details h2 {
        font-size: 32px !important;
        line-height: 44px !important;
    }

@media (max-width: 767.98px) {
    .event-details-page .news-details h2 {
        font-size: 24px !important;
        line-height: 34px !important;
    }
}

.testimonial-wrapper {
    padding: 48px;
    gap: 40px;
    border: 1px solid #d5d5d5;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    margin-block: 24px;
}

@media (max-width: 575.98px) {
    .testimonial-wrapper {
        padding: 24px;
        gap: 24px;
    }
}

.testimonial-wrapper.newstyle {
    background: radial-gradient(159.21% 445.11% at -15.86% -45.06%, rgba(255, 255, 255, 0) 0%, var(--surface-2) 100%);
}

.testimonial-wrapper.text-color p.fs-24 {
    font-weight: 500 !important;
}

.testimonial-wrapper.no-border {
    border: 0;
    padding: 0;
    margin-block: 0;
}

    .testimonial-wrapper.no-border figure {
        margin-bottom: 0;
    }

    .testimonial-wrapper.no-border .testimonial-author {
        gap: 32px !important;
    }

        .testimonial-wrapper.no-border .testimonial-author figure {
            height: auto;
            width: 354px;
        }

@media only screen and (max-width: 1600px) {
    .testimonial-wrapper.no-border .testimonial-author figure {
        width: 250px;
    }
}

.testimonial-wrapper.no-border .testimonial-author figure img {
    height: 100%;
}

.testimonial-wrapper.no-border .testimonial-author .testimonial-author-info {
    text-align: center;
}

.testimonial-wrapper.no-border .testimonial-content {
    border-inline-start: 1px solid #d5d5d5;
    padding-inline-start: 48px;
}

    .testimonial-wrapper.no-border .testimonial-content .fs-20,
    .testimonial-wrapper.no-border .testimonial-content .fs-20 p {
        font-size: 20px;
        font-size: clamp(12px, 12px + 0vw, 12px);
    }

@media (min-width: 768px) {
    .testimonial-wrapper.no-border .testimonial-content .fs-20,
    .testimonial-wrapper.no-border .testimonial-content .fs-20 p {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .testimonial-wrapper.no-border .testimonial-content .fs-20,
    .testimonial-wrapper.no-border .testimonial-content .fs-20 p {
        font-size: clamp(12px, -1.3333333333px + 1.1111111111vw, 20px);
    }
}

@media (max-width: 767.98px) {
    .testimonial-wrapper.no-border {
        flex-wrap: wrap;
        flex-direction: column !important;
    }

        .testimonial-wrapper.no-border.h-100 {
            height: auto !important;
        }

        .testimonial-wrapper.no-border .testimonial-author {
            width: 100%;
        }

        .testimonial-wrapper.no-border .testimonial-content {
            padding-top: 24px;
            border-inline-start: 0;
            border-top: 1px solid #d5d5d5;
        }
}

.testimonial-author {
    gap: 20px;
}

    .testimonial-author figure {
        height: 80px;
        width: 80px;
    }

.testimonial-content figure {
    margin-bottom: 20px;
}

.updates .card.card-list.newsletter.counter .fs-24 {
    font-size: 24px;
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .updates .card.card-list.newsletter.counter .fs-24 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .updates .card.card-list.newsletter.counter .fs-24 {
        font-size: clamp(12px, -8px + 1.6666666667vw, 24px);
    }
}

/*!
* Style Sheet for ""
* version: 1
* last modified:2023 By Applab
* author: Applab
* website: www.applab.qa
*/
.alert-primary {
    --bs-alert-color: var(--bs-primary-text);
    --bs-alert-bg: var(--bs-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-primary-border-subtle);
    --bs-alert-link-color: var(--bs-primary-text);
}

.alert-white {
    --bs-alert-color: var(--bs-white-text);
    --bs-alert-bg: var(--bs-white-bg-subtle);
    --bs-alert-border-color: var(--bs-white-border-subtle);
    --bs-alert-link-color: var(--bs-white-text);
}

.alert-black {
    --bs-alert-color: var(--bs-black-text);
    --bs-alert-bg: var(--bs-black-bg-subtle);
    --bs-alert-border-color: var(--bs-black-border-subtle);
    --bs-alert-link-color: var(--bs-black-text);
}

.alert-secondary {
    --bs-alert-color: var(--bs-secondary-text);
    --bs-alert-bg: var(--bs-secondary-bg-subtle);
    --bs-alert-border-color: var(--bs-secondary-border-subtle);
    --bs-alert-link-color: var(--bs-secondary-text);
}

.alert-light-primary {
    --bs-alert-color: var(--bs-light-primary-text);
    --bs-alert-bg: var(--bs-light-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-light-primary-border-subtle);
    --bs-alert-link-color: var(--bs-light-primary-text);
}

.alert-light-bg {
    --bs-alert-color: var(--bs-light-bg-text);
    --bs-alert-bg: var(--bs-light-bg-bg-subtle);
    --bs-alert-border-color: var(--bs-light-bg-border-subtle);
    --bs-alert-link-color: var(--bs-light-bg-text);
}

.alert-grey {
    --bs-alert-color: var(--bs-grey-text);
    --bs-alert-bg: var(--bs-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-grey-border-subtle);
    --bs-alert-link-color: var(--bs-grey-text);
}

.alert-purple {
    --bs-alert-color: var(--bs-purple-text);
    --bs-alert-bg: var(--bs-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-purple-border-subtle);
    --bs-alert-link-color: var(--bs-purple-text);
}

.alert-dark-purple {
    --bs-alert-color: var(--bs-dark-purple-text);
    --bs-alert-bg: var(--bs-dark-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-purple-border-subtle);
    --bs-alert-link-color: var(--bs-dark-purple-text);
}

.alert-violet {
    --bs-alert-color: var(--bs-violet-text);
    --bs-alert-bg: var(--bs-violet-bg-subtle);
    --bs-alert-border-color: var(--bs-violet-border-subtle);
    --bs-alert-link-color: var(--bs-violet-text);
}

.alert-dark-grey {
    --bs-alert-color: var(--bs-dark-grey-text);
    --bs-alert-bg: var(--bs-dark-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-grey-border-subtle);
    --bs-alert-link-color: var(--bs-dark-grey-text);
}

.alert-light-black {
    --bs-alert-color: var(--bs-light-black-text);
    --bs-alert-bg: var(--bs-light-black-bg-subtle);
    --bs-alert-border-color: var(--bs-light-black-border-subtle);
    --bs-alert-link-color: var(--bs-light-black-text);
}

.alert-border-color {
    --bs-alert-color: var(--bs-border-color-text);
    --bs-alert-bg: var(--bs-border-color-bg-subtle);
    --bs-alert-border-color: var(--bs-border-color-border-subtle);
    --bs-alert-link-color: var(--bs-border-color-text);
}

.alert-grey1 {
    --bs-alert-color: var(--bs-grey1-text);
    --bs-alert-bg: var(--bs-grey1-bg-subtle);
    --bs-alert-border-color: var(--bs-grey1-border-subtle);
    --bs-alert-link-color: var(--bs-grey1-text);
}

.alert-grey2 {
    --bs-alert-color: var(--bs-grey2-text);
    --bs-alert-bg: var(--bs-grey2-bg-subtle);
    --bs-alert-border-color: var(--bs-grey2-border-subtle);
    --bs-alert-link-color: var(--bs-grey2-text);
}

.alert-gray-color {
    --bs-alert-color: var(--bs-gray-color-text);
    --bs-alert-bg: var(--bs-gray-color-bg-subtle);
    --bs-alert-border-color: var(--bs-gray-color-border-subtle);
    --bs-alert-link-color: var(--bs-gray-color-text);
}

.alert-gray3 {
    --bs-alert-color: var(--bs-gray3-text);
    --bs-alert-bg: var(--bs-gray3-bg-subtle);
    --bs-alert-border-color: var(--bs-gray3-border-subtle);
    --bs-alert-link-color: var(--bs-gray3-text);
}

.alert-light-grey {
    --bs-alert-color: var(--bs-light-grey-text);
    --bs-alert-bg: var(--bs-light-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-light-grey-border-subtle);
    --bs-alert-link-color: var(--bs-light-grey-text);
}

.bg-primary {
    background: var(--primary) !important;
}

.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
    }

.btn-outline-primary {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary-accent);
}

    .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
        box-shadow: none;
        outline: none;
    }

.text-primary {
    color: var(--primary-accent) !important;
}

.bg-white {
    background: var(--surface) !important;
}

.btn-white {
    background: var(--surface);
    border-color: var(--on-primary);
}

    .btn-white:hover, .btn-white:focus, .btn-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
    }

.btn-outline-white {
    background: transparent;
    border-color: var(--on-primary);
    color: var(--on-primary);
}

    .btn-outline-white:hover, .btn-outline-white:focus, .btn-outline-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
        box-shadow: none;
        outline: none;
    }

.text-white {
    color: var(--on-primary) !important;
}

.bg-black {
    background: var(--black) !important;
}

.btn-black {
    background: var(--black);
    border-color: var(--black);
}

    .btn-black:hover, .btn-black:focus, .btn-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
    }

.btn-outline-black {
    background: transparent;
    border-color: var(--black);
    color: var(--text);
}

    .btn-outline-black:hover, .btn-outline-black:focus, .btn-outline-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
        box-shadow: none;
        outline: none;
    }

.text-black {
    color: var(--text) !important;
}

.bg-secondary {
    background: var(--text-muted) !important;
}

.btn-secondary {
    background: var(--text-muted);
    border-color: var(--text-muted);
}

    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
    }

.btn-outline-secondary {
    background: transparent;
    border-color: var(--text-muted);
    color: var(--text-muted);
}

    .btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
        box-shadow: none;
        outline: none;
    }

.text-secondary {
    color: var(--text-muted) !important;
}

.bg-light-primary {
    background: var(--light-primary) !important;
}

.btn-light-primary {
    background: var(--light-primary);
    border-color: var(--light-primary);
}

    .btn-light-primary:hover, .btn-light-primary:focus, .btn-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
    }

.btn-outline-light-primary {
    background: transparent;
    border-color: var(--light-primary);
    color: var(--light-primary);
}

    .btn-outline-light-primary:hover, .btn-outline-light-primary:focus, .btn-outline-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
        box-shadow: none;
        outline: none;
    }

.text-light-primary {
    color: var(--light-primary) !important;
}

.bg-light-bg {
    background: var(--light-bg) !important;
}

.btn-light-bg {
    background: var(--light-bg);
    border-color: var(--light-bg);
}

    .btn-light-bg:hover, .btn-light-bg:focus, .btn-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
    }

.btn-outline-light-bg {
    background: transparent;
    border-color: var(--light-bg);
    color: var(--light-bg);
}

    .btn-outline-light-bg:hover, .btn-outline-light-bg:focus, .btn-outline-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
        box-shadow: none;
        outline: none;
    }

.text-light-bg {
    color: var(--light-bg) !important;
}

.bg-grey {
    background: var(--grey) !important;
}

.btn-grey {
    background: var(--grey);
    border-color: var(--grey);
}

    .btn-grey:hover, .btn-grey:focus, .btn-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
    }

.btn-outline-grey {
    background: transparent;
    border-color: var(--grey);
    color: var(--grey);
}

    .btn-outline-grey:hover, .btn-outline-grey:focus, .btn-outline-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
        box-shadow: none;
        outline: none;
    }

.text-grey {
    color: var(--grey) !important;
}

.bg-purple {
    background: var(--purple) !important;
}

.btn-purple {
    background: var(--purple);
    border-color: var(--purple);
}

    .btn-purple:hover, .btn-purple:focus, .btn-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
    }

.btn-outline-purple {
    background: transparent;
    border-color: var(--purple);
    color: var(--purple);
}

    .btn-outline-purple:hover, .btn-outline-purple:focus, .btn-outline-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
        box-shadow: none;
        outline: none;
    }

.text-purple {
    color: var(--purple) !important;
}

.bg-dark-purple {
    background: var(--dark-purple) !important;
}

.btn-dark-purple {
    background: var(--dark-purple);
    border-color: var(--dark-purple);
}

    .btn-dark-purple:hover, .btn-dark-purple:focus, .btn-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
    }

.btn-outline-dark-purple {
    background: transparent;
    border-color: var(--dark-purple);
    color: var(--dark-purple);
}

    .btn-outline-dark-purple:hover, .btn-outline-dark-purple:focus, .btn-outline-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
        box-shadow: none;
        outline: none;
    }

.text-dark-purple {
    color: var(--dark-purple) !important;
}

.bg-violet {
    background: var(--violet) !important;
}

.btn-violet {
    background: var(--violet);
    border-color: var(--violet);
}

    .btn-violet:hover, .btn-violet:focus, .btn-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
    }

.btn-outline-violet {
    background: transparent;
    border-color: var(--violet);
    color: var(--primary-accent);
}

    .btn-outline-violet:hover, .btn-outline-violet:focus, .btn-outline-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
        box-shadow: none;
        outline: none;
    }

.text-violet {
    color: var(--primary-accent) !important;
}

.bg-dark-grey {
    background: var(--dark-grey) !important;
}

.btn-dark-grey {
    background: var(--dark-grey);
    border-color: var(--dark-grey);
}

    .btn-dark-grey:hover, .btn-dark-grey:focus, .btn-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
    }

.btn-outline-dark-grey {
    background: transparent;
    border-color: var(--dark-grey);
    color: var(--dark-grey);
}

    .btn-outline-dark-grey:hover, .btn-outline-dark-grey:focus, .btn-outline-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
        box-shadow: none;
        outline: none;
    }

.text-dark-grey {
    color: var(--dark-grey) !important;
}

.bg-light-black {
    background: var(--light-black) !important;
}

.btn-light-black {
    background: var(--light-black);
    border-color: var(--light-black);
}

    .btn-light-black:hover, .btn-light-black:focus, .btn-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
    }

.btn-outline-light-black {
    background: transparent;
    border-color: var(--light-black);
    color: var(--light-black);
}

    .btn-outline-light-black:hover, .btn-outline-light-black:focus, .btn-outline-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
        box-shadow: none;
        outline: none;
    }

.text-light-black {
    color: var(--light-black) !important;
}

.bg-border-color {
    background: var(--border-color) !important;
}

.btn-border-color {
    background: var(--border-color);
    border-color: var(--border-color);
}

    .btn-border-color:hover, .btn-border-color:focus, .btn-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
    }

.btn-outline-border-color {
    background: transparent;
    border-color: var(--border-color);
    color: var(--border-color);
}

    .btn-outline-border-color:hover, .btn-outline-border-color:focus, .btn-outline-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
        box-shadow: none;
        outline: none;
    }

.text-border-color {
    color: var(--border-color) !important;
}

.bg-grey1 {
    background: var(--grey1) !important;
}

.btn-grey1 {
    background: var(--grey1);
    border-color: var(--grey1);
}

    .btn-grey1:hover, .btn-grey1:focus, .btn-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
    }

.btn-outline-grey1 {
    background: transparent;
    border-color: var(--grey1);
    color: var(--grey1);
}

    .btn-outline-grey1:hover, .btn-outline-grey1:focus, .btn-outline-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
        box-shadow: none;
        outline: none;
    }

.text-grey1 {
    color: var(--grey1) !important;
}

.bg-grey2 {
    background: var(--grey2) !important;
}

.btn-grey2 {
    background: var(--grey2);
    border-color: var(--grey2);
}

    .btn-grey2:hover, .btn-grey2:focus, .btn-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
    }

.btn-outline-grey2 {
    background: transparent;
    border-color: var(--grey2);
    color: var(--grey2);
}

    .btn-outline-grey2:hover, .btn-outline-grey2:focus, .btn-outline-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
        box-shadow: none;
        outline: none;
    }

.text-grey2 {
    color: var(--grey2) !important;
}

.bg-gray-color {
    background: var(--gray-color) !important;
}

.btn-gray-color {
    background: var(--gray-color);
    border-color: var(--gray-color);
}

    .btn-gray-color:hover, .btn-gray-color:focus, .btn-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
    }

.btn-outline-gray-color {
    background: transparent;
    border-color: var(--gray-color);
    color: var(--gray-color);
}

    .btn-outline-gray-color:hover, .btn-outline-gray-color:focus, .btn-outline-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
        box-shadow: none;
        outline: none;
    }

.text-gray-color {
    color: var(--gray-color) !important;
}

.bg-gray3 {
    background: var(--gray3) !important;
}

.btn-gray3 {
    background: var(--gray3);
    border-color: var(--gray3);
}

    .btn-gray3:hover, .btn-gray3:focus, .btn-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
    }

.btn-outline-gray3 {
    background: transparent;
    border-color: var(--gray3);
    color: var(--gray3);
}

    .btn-outline-gray3:hover, .btn-outline-gray3:focus, .btn-outline-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
        box-shadow: none;
        outline: none;
    }

.text-gray3 {
    color: var(--gray3) !important;
}

.bg-light-grey {
    background: var(--light-grey) !important;
}

.btn-light-grey {
    background: var(--light-grey);
    border-color: var(--light-grey);
}

    .btn-light-grey:hover, .btn-light-grey:focus, .btn-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
    }

.btn-outline-light-grey {
    background: transparent;
    border-color: var(--light-grey);
    color: var(--light-grey);
}

    .btn-outline-light-grey:hover, .btn-outline-light-grey:focus, .btn-outline-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
        box-shadow: none;
        outline: none;
    }

.text-light-grey {
    color: var(--light-grey) !important;
}

.fs-56 {
    font-size: clamp(30px, 30px + 0vw, 30px);
}

@media (min-width: 768px) {
    .fs-56 {
        font-size: clamp(30px, 30px + 0vw, 30px);
    }
}

@media (min-width: 1200px) {
    .fs-56 {
        font-size: clamp(30px, -13.3333333333px + 3.6111111111vw, 56px);
    }
}

.fs-40 {
    font-size: clamp(18px, 13.7142857143px + 1.3392857143vw, 24px);
}

@media (min-width: 768px) {
    .fs-40 {
        font-size: clamp(24px, 24px + 0vw, 24px);
    }
}

@media (min-width: 1200px) {
    .fs-40 {
        font-size: clamp(24px, -2.6666666667px + 2.2222222222vw, 40px);
    }
}

.fs-38 {
    font-size: clamp(18px, 15.1428571429px + 0.8928571429vw, 22px);
}

@media (min-width: 768px) {
    .fs-38 {
        font-size: clamp(22px, 22px + 0vw, 22px);
    }
}

@media (min-width: 1200px) {
    .fs-38 {
        font-size: clamp(22px, -4.6666666667px + 2.2222222222vw, 38px);
    }
}

.fs-32 {
    font-size: clamp(18px, 16.5714285714px + 0.4464285714vw, 20px);
}

@media (min-width: 768px) {
    .fs-32 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .fs-32 {
        font-size: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.fs-28 {
    font-size: clamp(16px, 14.5714285714px + 0.4464285714vw, 18px);
}

@media (min-width: 768px) {
    .fs-28 {
        font-size: clamp(18px, 18px + 0vw, 18px);
    }
}

@media (min-width: 1200px) {
    .fs-28 {
        font-size: clamp(18px, 1.3333333333px + 1.3888888889vw, 28px);
    }
}

.fs-24 {
    font-size: clamp(16px, 16px + 0vw, 16px);
}

@media (min-width: 768px) {
    .fs-24 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-24 {
        font-size: clamp(16px, 2.6666666667px + 1.1111111111vw, 24px);
    }
}

.fs-22 {
    font-size: clamp(14px, 12.5714285714px + 0.4464285714vw, 16px);
}

@media (min-width: 768px) {
    .fs-22 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-22 {
        font-size: clamp(16px, 6px + 0.8333333333vw, 22px);
    }
}

.fs-20 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-20 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-20 {
        font-size: clamp(12px, -1.3333333333px + 1.1111111111vw, 20px);
    }
}

.fs-18 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-18 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-18 {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

.fs-16 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-16 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-16 {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

.fs-15 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-15 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-15 {
        font-size: clamp(12px, 7px + 0.4166666667vw, 15px);
    }
}

.fs-14 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-14 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-14 {
        font-size: clamp(10px, 3.3333333333px + 0.5555555556vw, 14px);
    }
}

.fs-12 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-12 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-12 {
        font-size: clamp(10px, 6.6666666667px + 0.2777777778vw, 12px);
    }
}

.section-title {
    text-align: start;
}

@media (max-width: 767.98px) {
    .section-title {
        margin-bottom: 24px !important;
    }
}

@media (max-width: 991.98px) {
    .section-title {
        padding-inline: 0 !important;
    }
}

.sub-title {
    text-transform: none;
    text-align: start;
    color: var(--text-muted);
}

.breadcrumb-menu {
    background-color: var(--surface-2);
    border: 1px solid var(--border-color);
    padding: 18px 0;
}

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
        content: var(--bs-breadcrumb-divider, ">");
        color: var(--purple);
        float: inline-start !important;
        padding-inline-end: var(--bs-breadcrumb-item-padding-x) !important;
    }

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item a {
        font-weight: 400;
        font-size: 16px;
        line-height: 19px;
        letter-spacing: -0.18px;
        color: var(--text-muted);
    }

        .breadcrumb-menu nav .breadcrumb .breadcrumb-item a.active {
            color: var(--purple);
        }

.filter-items {
    padding: 16px 24px;
    border: 1px solid var(--secondary);
    height: 54px;
    border-radius: 25px;
    display: flex;
    align-items: center;
}

@media (max-width: 575.98px) {
    .filter-items {
        padding: 10px;
        height: 42px;
    }

        .filter-items input, .filter-items select {
            font-size: 12px !important;
        }
}

.filter-items input {
    border: 0;
    box-shadow: none;
    width: 100%;
}

    .filter-items input::placeholder {
        color: var(--primary-accent);
    }

    .filter-items input:focus {
        outline: none;
    }

.filter-items.search-box {
    display: flex;
    width: 138px;
    max-width: 100%;
    transition: width 0.3s ease-in-out;
}

    .filter-items.search-box:focus-within {
        width: 320px;
    }


.filter-items i {
    color: var(--primary-accent);
}

.filter-items select {
    border: 0;
    color: var(--primary-accent);
}

    .filter-items select:focus {
        outline: none;
    }

.filter-tabs {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.pagination {
    gap: 8px;
}

@media (max-width: 767.98px) {
    .pagination {
        gap: 4px;
    }
}

.pagination .page-item.disable {
    opacity: 0.4;
    pointer-events: none;
}

.pagination .page-item .page-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    color: var(--primary-accent);
    border-radius: 100px;
    border: 0;
}

    .pagination .page-item .page-link:focus {
        box-shadow: none;
    }

@media (max-width: 575.98px) {
    .pagination .page-item .page-link {
        width: 32px;
        height: 32px;
        font-size: 14px;
    }
}

.pagination .page-item .page-link[aria-label=Previous], .pagination .page-item .page-link[aria-label=Next] {
    border: 1px solid var(--violet);
    border-radius: 100px;
}

html[dir=rtl] .pagination .page-item .page-link[aria-label=Previous], html[dir=rtl] .pagination .page-item .page-link[aria-label=Next] {
    transform: scaleX(-1);
}

.pagination .page-item .page-link i {
    color: var(--purple);
}

    .pagination .page-item .page-link i::before {
        content: "";
        font-weight: bold;
        font-size: 18px;
        background-image: url(../../assets/images/icons/left-arrow-sm.svg);
        background-repeat: no-repeat;
        background-size: cover;
        width: 7px;
        height: 12px;
        display: block;
    }

    .pagination .page-item .page-link i.next::before {
        transform: rotate(180deg);
    }

    /* RTL: the arrow icon is a left-pointing background image; the .next arrow is
       rotated 180deg to point right. Reverse both in Arabic: prev points right,
       next points left. Keyed on the .next class the pagination JS emits. */
    html[dir=rtl] .pagination .page-item .page-link i::before {
        transform: rotate(180deg);
    }

    html[dir=rtl] .pagination .page-item .page-link i.next::before {
        transform: none;
    }

.pagination .page-item:hover .page-link {
    background-color: #EFEFEF;
}

    .pagination .page-item:hover .page-link[aria-label=Previous], .pagination .page-item:hover .page-link[aria-label=Next] {
        background: var(--surface) !important;
    }

.pagination .page-item:focus .page-link, .pagination .page-item.active .page-link {
    background-color: var(--secondary);
    color: var(--primary-accent);
    border: none;
}

    .pagination .page-item:focus .page-link img, .pagination .page-item.active .page-link img {
        filter: brightness(0) invert(1);
    }

.pagination .page-prev .page-link, .pagination .page-next .page-link {
    border: none !important;
}

.news-list-page .news-box {
    flex: 0 0 auto;
    flex-shrink: 0;
    width: 33.33333333% !important;
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) * 0.5);
    padding-left: calc(var(--bs-gutter-x) * 0.5);
    margin-top: var(--bs-gutter-y);
    margin-bottom: 56px;
    position: relative;
}

@media (max-width: 991.98px) {
    .news-list-page .news-box {
        width: 50% !important;
    }
}

@media (max-width: 575.98px) {
    .news-list-page .news-box {
        width: 100% !important;
    }
}

.news-list-page .news-box figure {
    position: relative;
    overflow: hidden;
    margin-bottom: 38px;
    border-radius: 16px;
    aspect-ratio: 3 / 2;
}

    .news-list-page .news-box figure img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: all 0.3s ease-in-out;
    }

    .news-list-page .news-box figure .label {
        position: absolute;
        inset-block-start: 16px;
        inset-inline-start: 16px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 4px 16px 5px;
        gap: 8px;
        width: max-content;
        height: 26px;
        background: rgba(229, 229, 230, 0.8);
        border-radius: 16px;
        font-weight: 400;
        color: var(--purple);
        transition: all 0.5s ease-in-out;
    }

    .news-list-page .news-box figure .date-box {
        position: absolute;
        inset-block-end: 16px;
        inset-inline-start: 16px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 8px 18px;
        background: var(--surface);
        border-radius: 10px;
    }

        .news-list-page .news-box figure .date-box h4 {
            margin: 0;
        }

        .news-list-page .news-box figure .date-box p {
            color: var(--purple);
            margin: 0;
        }

        .news-list-page .news-box figure .date-box hr {
            border-top: 0.5px solid rgba(0, 0, 0, 0.2);
            width: 49px;
            opacity: 1;
            margin: 0;
        }

.news-list-page .news-box:hover figure img {
    scale: 1.04;
}

.news-list-page .news-box .news-details h2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 3em;
}

@media (min-width: 1200px) {
    .events-page .news-box {
        width: 25% !important;
    }
}

.extra-styles .news-details {
    width: auto !important;
}

.extra-styles .news-box {
    margin-bottom: 0;
}

@media (max-width: 767.98px) {
    .updates .news-list {
        display: block !important;
    }
}

.updates .news-list .news-box {
    position: relative;
    overflow: hidden;
    cursor: pointer;
    width: calc(50% - 1rem);
}

    .updates .news-list .news-box a::before {
        content: "";
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
    }

    .updates .news-list .news-box figure {
        object-fit: contain;
        background-image: url(../../assets/images/logo.png);
        background-repeat: no-repeat;
        background-size: 80%;
        background-position: center center;
        background-color: var(--surface-3);
        transition: background-position 0.5s ease;
        width: 100%;
        height: 345px;
        border-radius: 16px;
        overflow: hidden;
        position: relative;
    }

@media (max-width: 767.98px) {
    .updates .news-list .news-box figure {
        width: 100% !important;
    }
}

.updates .news-list .news-box figure img {
    transition: all 0.3s ease-in-out;
}

.updates .news-list .news-box:hover h2, .updates .news-list .news-box:hover a {
    color: var(--purple) !important;
}

.updates .news-list .news-box:hover .date-box {
    background: var(--purple) !important;
}

    .updates .news-list .news-box:hover .date-box h4,
    .updates .news-list .news-box:hover .date-box p {
        color: var(--on-primary) !important;
    }

    .updates .news-list .news-box:hover .date-box hr {
        border-color: var(--on-primary) !important;
        opacity: 0.2;
    }

.updates .news-list .news-box:hover figure img {
    scale: 1.04;
}

.updates .news-list .news-box .label {
    position: absolute;
    inset: 16px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 4px 16px 5px;
    gap: 8px;
    width: max-content;
    height: 26px;
    background: rgba(229, 229, 230, 0.8);
    border-radius: 16px;
    font-weight: 400;
    color: var(--purple);
    transition: all 0.5s ease-in-out;
    inset-inline-start: 16px;
}

.updates .news-list .news-box .date-box {
    position: absolute;
    inset-block-end: 13px;
    inset-inline-start: 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 8px 18px;
    background: var(--surface);
    border-radius: 10px;
}

    .updates .news-list .news-box .date-box h4 {
        margin: 0;
    }

    .updates .news-list .news-box .date-box p {
        color: var(--purple);
        margin: 0;
    }

    .updates .news-list .news-box .date-box hr {
        border-top: 0.5px solid rgba(0, 0, 0, 0.2);
        width: 49px;
        opacity: 1;
        margin: 0;
    }

.updates .news-list .news-box.bordererd {
    border: 1px solid var(--border-color);
    padding: 32px;
    border-radius: 16px;
    transition: all 0.5s ease-in-out;
}

@media (max-width: 991.98px) {
    .updates .news-list .news-box.bordererd {
        padding: 10px !important;
    }
}

.updates .news-list .news-box.bordererd .label {
    position: relative;
    inset: 0;
    margin-bottom: 32px;
}

.updates .news-list .news-box.bordererd h2 {
    margin-bottom: 32px;
}

.updates .news-list .news-box.bordererd:hover {
    border-color: var(--violet);
}

    .updates .news-list .news-box.bordererd:hover .label {
        background-color: var(--violet);
        color: var(--on-primary);
    }

@media (max-width: 991.98px) {
    .updates .news-list .news-box {
        width: 100%;
    }
}

.updates .news-details {
    width: 100%;
}

    .updates .news-details p {
        font-weight: 400;
        color: var(--text-muted);
        margin-bottom: 0;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .updates .news-details i {
        font-size: 6px;
    }

        .updates .news-details i.bi-geo-alt {
            font-size: 11px;
        }

    .updates .news-details h2 {
        line-height: 34px;
        height: auto;
        overflow: hidden;
    }

@media (max-width: 575.98px) {
    .updates .news-details h2 {
        line-height: 26px;
    }
}

.updates .border-end {
    height: 84%;
    margin-top: 70px;
    border-color: var(--border);
}

@media (max-width: 767.98px) {
    .updates .border-end {
        border-top: 1px solid var(--border) !important;
        border-right: 0 !important;
        width: 75%;
    }
}

.news-details-page {
    margin-bottom: 32px;
}

    .news-details-page .news-box {
        width: 100% !important;
        max-width: 100%;
        margin-bottom: 32px;
        display: flex;
        flex-direction: column;
    }

        .news-details-page .news-box figure {
            overflow: hidden;
            margin-bottom: 32px;
            height: 600px;
            order: 1;
            border-radius: 16px;
        }

@media (max-width: 767.98px) {
    .news-details-page .news-box figure {
        height: 200px;
    }
}

.news-details-page .news-box figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.3s ease-in-out;
}

.news-details-page .news-box .label {
    position: relative;
    order: 2;
    inset: 0;
    width: fit-content;
    background-color: rgba(229, 229, 230, 0.8);
    color: var(--primary-accent);
    padding: 6px 16px;
    border-radius: 16px;
    font-weight: 600;
}

.news-details-page .news-details {
    order: 3;
    display: flex;
    flex-direction: column;
    width: 100%;
}

    .news-details-page .news-details .date-location {
        order: 2;
    }

    .news-details-page .news-details h2 {
        order: 1;
        color: var(--primary-accent) !important;
    }

.share-social-media {
    padding: 12px;
    gap: 20px;
}

.share-social-icons {
    display: flex;
    gap: 10px;
}

    .share-social-icons a {
        padding: 5px 9px;
    }

        .share-social-icons a svg {
            fill: var(--text);
            width: 14px;
            height: 14px;
        }

        .share-social-icons a img {
            width: 14px;
            height: 14px;
        }

.event-details-page .news-box label {
    margin-bottom: 24px;
}

.event-details-page .news-details {
    width: 66.66666667%;
}

    .event-details-page .news-details h2 {
        font-size: 32px !important;
        line-height: 44px !important;
    }

@media (max-width: 767.98px) {
    .event-details-page .news-details h2 {
        font-size: 24px !important;
        line-height: 34px !important;
    }
}

.media-centre-tabs.policy.sticky-tabs,
#media-centre-tabs.policy.sticky-tabs {
    position: sticky;
    top: 0;
    background-color: var(--surface);
    z-index: 8;
    padding-top: 1rem;
    padding-bottom: 1rem;
    height: 85px;
}

.media-centre-tabs.policy .tabs-wrapper,
#media-centre-tabs.policy .tabs-wrapper {
    justify-content: flex-start;
}

.media-centre-tabs .tabs-wrapper,
#media-centre-tabs .tabs-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 72px;
    overflow: auto;
    cursor: grab;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

    .media-centre-tabs .tabs-wrapper::-webkit-scrollbar,
    #media-centre-tabs .tabs-wrapper::-webkit-scrollbar {
        display: none;
    }

    .media-centre-tabs .tabs-wrapper.dragging,
    #media-centre-tabs .tabs-wrapper.dragging {
        cursor: grabbing;
        user-select: none;
    }

@media (max-width: 575.98px) {
    .media-centre-tabs .tabs-wrapper,
    #media-centre-tabs .tabs-wrapper {
        gap: 16px;
    }
}

@media (max-width: 767.98px) {
    .media-centre-tabs .tabs-wrapper,
    #media-centre-tabs .tabs-wrapper {
        overflow: auto;
        justify-content: flex-start;
    }

        .media-centre-tabs .tabs-wrapper a,
        #media-centre-tabs .tabs-wrapper a {
            white-space: nowrap;
        }
}

@media (min-width: 992px) and (max-width: 1400px) {
    .media-centre-tabs .tabs-wrapper,
    #media-centre-tabs .tabs-wrapper {
        gap: 32px !important;
    }
}

.media-centre-tabs .btn-tab,
#media-centre-tabs .btn-tab {
    font-size: 16px;
    font-weight: 400;
    color: var(--dark-grey);
    border-bottom: 3px solid transparent;
    transition: all 0.3s ease-in-out;
    white-space: nowrap;
}

    .media-centre-tabs .btn-tab:hover, .media-centre-tabs .btn-tab.active,
    #media-centre-tabs .btn-tab:hover,
    #media-centre-tabs .btn-tab.active {
        border-bottom: 3px solid var(--violet);
        color: var(--primary-accent);
    }

@media (min-width: 992px) and (max-width: 1400px) {
    .media-centre-tabs .btn-tab,
    #media-centre-tabs .btn-tab {
        font-size: 14px !important;
    }
}

.media-newsletter .swiper-slide > div,
#media-newsletter .swiper-slide > div {
    width: 100% !important;
}

.media-newsletter .swiper-wrapper,
#media-newsletter .swiper-wrapper {
    margin-bottom: 40px !important;
}

.mediaSwiper {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-block-end: 40px;
}

@media (max-width: 575.98px) {
    .mediaSwiper .swiper-slide {
        width: 100% !important;
    }
}

.mediaSwiper .swiper-slide .news-box, .mediaSwiper .swiper-slide .news-list-page {
    width: 100% !important;
}

.mediaSwiper .swiper-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px 18px;
    width: auto;
    height: 45px;
    background: rgba(174, 174, 174, 0.2);
    border-radius: 98px;
    left: unset;
}

    .mediaSwiper .swiper-pagination .swiper-pagination-bullet {
        width: 14px;
        height: 14px;
        background: var(--surface) !important;
        opacity: 1;
    }

        .mediaSwiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
            background: var(--purple) !important;
        }

#media-blog .mediaSwiper {
    padding-block-end: 93px;
}

.newsletter {
    border-radius: 16px !important;
    position: relative;
    height: 225px !important;
    transition: all 0.5s ease-in-out;
    overflow: hidden;
}

    .newsletter::after {
        content: "";
        position: absolute;
        inset-inline-end: 0;
        background: url("../images/icons/news-letter.svg") no-repeat bottom right;
        width: 100%;
        height: 100%;
        transition: all 0.3s ease-in-out;
    }

    .newsletter:hover {
        border: var(--violet) 1px solid !important;
    }

        .newsletter:hover:after {
            background: url("../images/icons/news-letter-2.svg") no-repeat bottom right;
        }

    .newsletter .card-body h5 {
        font-size: 20px;
        font-size: clamp(12px, 10.5714285714px + 0.4464285714vw, 14px);
    }

@media (min-width: 768px) {
    .newsletter .card-body h5 {
        font-size: clamp(14px, 14px + 0vw, 14px);
    }
}

@media (min-width: 1200px) {
    .newsletter .card-body h5 {
        font-size: clamp(14px, 4px + 0.8333333333vw, 20px);
    }
}

.newsletter .card-body p {
    font-size: 16px;
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .newsletter .card-body p {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .newsletter .card-body p {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

.newsletter .card-title {
    -webkit-line-clamp: 3 !important;
}

.newsletter.counter::after {
    display: none;
}

.newsletter.counter .counter-number {
    position: absolute;
    inset-inline-end: 24px;
    bottom: 24px;
    font-weight: 500;
    font-size: 56px;
    font-size: clamp(26px, 16px + 3.125vw, 40px);
    letter-spacing: -0.02em;
    background: linear-gradient(100.06deg, var(--primary) -4.33%, rgba(80, 39, 176, 0) 122.3%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    margin-bottom: 0;
}

@media (min-width: 768px) {
    .newsletter.counter .counter-number {
        font-size: clamp(40px, 40px + 0vw, 40px);
    }
}

@media (min-width: 1200px) {
    .newsletter.counter .counter-number {
        font-size: clamp(40px, 13.3333333333px + 2.2222222222vw, 56px);
    }
}

.newsletter.counter:hover {
    border-color: var(--border-color) !important;
    box-shadow: none !important;
}

.publications {
    background: radial-gradient(110.39% 287.34% at 10.34% 0%, rgba(255, 255, 255, 0) 0%, var(--surface-2) 100%), var(--surface) !important;
    transition: all 0.5s ease-in-out;
    border: 1px solid var(--border);
    padding: 1rem;
    border-radius: 16px;
    height: 350px !important;
}

@media only screen and (max-width: 1599.98px) {
    .publications {
        height: 300px !important;
    }
}

@media (max-width: 1199.98px) {
    .publications {
        height: auto !important;
    }
}

@media (max-width: 575.98px) {
    .publications {
        height: auto !important;
    }
}

.publications-wrapper {
    display: flex;
    gap: 2rem;
    overflow: hidden;
}

@media (min-width: 768px) and (max-width: 1199.98px) {
    .publications-wrapper {
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media (max-width: 575.98px) {
    .publications-wrapper {
        flex-direction: column;
    }
}

.publications figure {
    min-width: 35%;
    max-width: 35%;
    border-radius: 16px;
    overflow: hidden;
    --bs-aspect-ratio: 75.86%;
}

.globalEconomyCard figure {
    min-width: 28% !important;
}

@media (max-width: 767.98px) {
    .publications figure {
        min-width: 30% !important;
        max-width: 30% !important;
    }
}

@media (max-width: 575.98px) {
    .publications figure {
        min-width: 100% !important;
        max-width: 100% !important;
        min-height: 200px;
        max-height: 200px;
    }
}

.publications figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.3s ease;
    mask-image: none !important;
}

@media (max-width: 575.98px) {
    .publications figure img {
        height: auto;
        object-position: center center;
    }
}

.publications-details {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1rem;
    transition: all 0.3s ease;
    transform: translateY(20px);
}

    .publications-details .publication-card-text {
        -webkit-line-clamp: 4 !important;
        overflow: auto !important;
    }

.publications-btns {
    display: flex;
    gap: 12px;
}

@media (max-width: 1199.98px) {
    .publications-btns {
        flex-wrap: wrap;
    }
}

.publications-btns .more-btn {
    display: inline-flex !important;
    line-height: 1;
    background: var(--surface-3);
    border-radius: 72px;
    font-family: var(--primary-font);
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--on-primary);
    text-align: center;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    transition: none;
    color: var(--primary-accent) !important;
    width: 150px;
    width: clamp(100px, 85.7142857143px + 4.4642857143vw, 120px);
    text-decoration: none !important;
    font-size: 16px;
    font-size: clamp(12px, 12px + 0vw, 12px);
    opacity: 0;
    padding-block: 16px;
    padding-block: clamp(12px, 12px + 0vw, 12px);
    padding-inline: 32px;
    padding-inline: clamp(15px, 11.4285714286px + 1.1160714286vw, 20px);
    transition: all 0.1s ease-in-out;
}

    .publications-btns .more-btn i {
        font-size: 9px;
        color: var(--on-primary);
        display: none;
        align-items: center;
    }

@media (max-width: 767.98px) {
    .publications-btns .more-btn {
        font-size: 12px !important;
    }
}

@media (min-width: 992px) and (max-width: 1400px) {
    .publications-btns .more-btn {
        font-size: 12px !important;
    }
}

@media (min-width: 768px) {
    .publications-btns .more-btn {
        width: clamp(120px, 120px + 0vw, 120px);
    }
}

@media (min-width: 1200px) {
    .publications-btns .more-btn {
        width: clamp(120px, 70px + 4.1666666667vw, 150px);
    }
}

@media (min-width: 768px) {
    .publications-btns .more-btn {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .publications-btns .more-btn {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

@media (min-width: 768px) {
    .publications-btns .more-btn {
        padding-block: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .publications-btns .more-btn {
        padding-block: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

@media (min-width: 768px) {
    .publications-btns .more-btn {
        padding-inline: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .publications-btns .more-btn {
        padding-inline: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.publications-btns .more-btn:hover {
    background: var(--violet) !important;
    color: var(--on-primary) !important;
}

.publications span {
    color: var(--primary-accent);
}

.publications:hover {
    border-color: var(--violet) !important;
}

    .publications:hover .card-body figure img {
        transform: scale(1.1);
    }

    .publications:hover .card-body .more-btn {
        opacity: 1;
    }

    .publications:hover .publications-details {
        transform: translateY(0px);
    }

.publications .publication-description-clamp {
    display: block !important;
    -webkit-line-clamp: unset !important;
    -webkit-box-orient: unset !important;
    line-height: 1.5;
    max-height: calc(1.5em * 4);
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

    .publications .publication-description-clamp::-webkit-scrollbar {
        display: none;
    }

.new-cards {
    padding: 32px !important;
}

    .new-cards .publications-wrapper {
        align-items: start;
    }

@media (max-width: 575.98px) {
    .new-cards .publications-wrapper {
        flex-direction: column;
    }

        .new-cards .publications-wrapper figure {
            width: 100%;
        }
}

.new-cards .card-body img {
    object-fit: contain !important;
}

.new-cards:hover {
    box-shadow: none !important;
    border-color: var(--border-color) !important;
}

    .new-cards:hover .card-body img {
        transform: none !important;
    }

.new-cards .more-btn {
    text-decoration: none;
}

@media (min-width: 992px) {
    .updates .row .col-lg-6 {
        display: flex;
        flex-direction: column;
    }

        .updates .row .col-lg-6 .card.new-cards {
            flex: 1;
            margin-bottom: 0;
        }
}

.new-cards .more-btn:hover {
    text-decoration: underline;
}

.taxation-media .tab-content .taxation-media-content figure {
    --bs-aspect-ratio: 51.11%;
    border-radius: 16px;
    overflow: hidden;
}

    .taxation-media .tab-content .taxation-media-content figure img,
    .taxation-media .tab-content .taxation-media-content figure video,
    .taxation-media .tab-content .taxation-media-content figure iframe {
        object-fit: cover;
    }

.blog-detail .news-box figure {
    display: none;
}

.blog-detail ul {
    padding-inline-start: 32px;
}

    .blog-detail ul li {
        font-size: 20px;
        color: var(--text-muted);
        margin-bottom: 16px;
        list-style: disc;
    }

.sticky-tabs {
    position: sticky;
    top: 0;
    background-color: var(--surface);
    z-index: 8;
}


.sticky-tabs,
.media-centre-tabs.policy.sticky-tabs,
#media-centre-tabs.policy.sticky-tabs {
    transition: top 0.6s ease;
}


body:has(#main-header.is-scrolled:not(.is-hidden)) .sticky-tabs,
body:has(#main-header.is-scrolled:not(.is-hidden)) .media-centre-tabs.policy.sticky-tabs,
body:has(#main-header.is-scrolled:not(.is-hidden)) #media-centre-tabs.policy.sticky-tabs {
    top: var(--header-height, 144px);
    transition: top 0.6s ease;
}

body.search-open .sticky-tabs,
body.search-open .media-centre-tabs.policy.sticky-tabs,
body.search-open #media-centre-tabs.policy.sticky-tabs {
    z-index: 7;
}

.blog-list-modern .news-box {
    background: var(--surface);
    border-radius: 12px;
    padding: 20px 24px;
    transition: all 0.3s ease-in-out;
    border: 0 !important;
    text-decoration: none;
    display: block;
    border: 1px solid var(--border-color) !important;
}

    .blog-list-modern .news-box .label {
        background: var(--surface-3);
        color: var(--primary-accent);
        border-radius: 9999px;
        padding: 4px 12px;
        font-size: 12px;
        font-weight: 400;
        margin-bottom: 12px;
        display: inline-block;
        position: relative;
        transition: all 0.3s ease-in-out;
    }

    .blog-list-modern .news-box .news-details h2 {
        font-size: 22px;
        font-weight: 700;
        min-height: 62px;
        color: var(--text-muted);
        line-height: 1.4;
        margin-bottom: 16px;
        transition: color 0.3s ease-in-out;
    }

@media only screen and (max-width: 1200px) {
    .blog-list-modern .news-box .news-details h2 {
        font-size: 16px;
        min-height: 45px;
    }
}

@media only screen and (max-width: 575.98px) {
    .blog-list-modern .news-box .news-details h2 {
        font-size: 14px;
        min-height: 40px;
    }
}

.blog-list-modern .news-box .news-details .date-location p {
    font-size: 14px;
    color: var(--text-muted);
    margin-bottom: 0;
}

.blog-list-modern .news-box .news-details .date-location i {
    font-size: 6px;
    color: var(--primary-accent);
}

.blog-list-modern .news-box:hover {
    transition: all 0.3s ease-in-out;
    border: 1px solid var(--primary) !important;
}

    .blog-list-modern .news-box:hover .label {
        background: var(--primary);
        color: var(--on-primary);
        transition: all 0.3s ease-in-out;
    }

    .blog-list-modern .news-box:hover .news-details h2 {
        color: var(--primary-accent);
        transition: color 0.3s ease-in-out;
    }

/*!
* Style Sheet for ""
* version: 1
* last modified:2023 By Applab
* author: Applab
* website: www.applab.qa
*/
.alert-primary {
    --bs-alert-color: var(--bs-primary-text);
    --bs-alert-bg: var(--bs-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-primary-border-subtle);
    --bs-alert-link-color: var(--bs-primary-text);
}

.alert-white {
    --bs-alert-color: var(--bs-white-text);
    --bs-alert-bg: var(--bs-white-bg-subtle);
    --bs-alert-border-color: var(--bs-white-border-subtle);
    --bs-alert-link-color: var(--bs-white-text);
}

.alert-black {
    --bs-alert-color: var(--bs-black-text);
    --bs-alert-bg: var(--bs-black-bg-subtle);
    --bs-alert-border-color: var(--bs-black-border-subtle);
    --bs-alert-link-color: var(--bs-black-text);
}

.alert-secondary {
    --bs-alert-color: var(--bs-secondary-text);
    --bs-alert-bg: var(--bs-secondary-bg-subtle);
    --bs-alert-border-color: var(--bs-secondary-border-subtle);
    --bs-alert-link-color: var(--bs-secondary-text);
}

.alert-light-primary {
    --bs-alert-color: var(--bs-light-primary-text);
    --bs-alert-bg: var(--bs-light-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-light-primary-border-subtle);
    --bs-alert-link-color: var(--bs-light-primary-text);
}

.alert-light-bg {
    --bs-alert-color: var(--bs-light-bg-text);
    --bs-alert-bg: var(--bs-light-bg-bg-subtle);
    --bs-alert-border-color: var(--bs-light-bg-border-subtle);
    --bs-alert-link-color: var(--bs-light-bg-text);
}

.alert-grey {
    --bs-alert-color: var(--bs-grey-text);
    --bs-alert-bg: var(--bs-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-grey-border-subtle);
    --bs-alert-link-color: var(--bs-grey-text);
}

.alert-purple {
    --bs-alert-color: var(--bs-purple-text);
    --bs-alert-bg: var(--bs-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-purple-border-subtle);
    --bs-alert-link-color: var(--bs-purple-text);
}

.alert-dark-purple {
    --bs-alert-color: var(--bs-dark-purple-text);
    --bs-alert-bg: var(--bs-dark-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-purple-border-subtle);
    --bs-alert-link-color: var(--bs-dark-purple-text);
}

.alert-violet {
    --bs-alert-color: var(--bs-violet-text);
    --bs-alert-bg: var(--bs-violet-bg-subtle);
    --bs-alert-border-color: var(--bs-violet-border-subtle);
    --bs-alert-link-color: var(--bs-violet-text);
}

.alert-dark-grey {
    --bs-alert-color: var(--bs-dark-grey-text);
    --bs-alert-bg: var(--bs-dark-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-grey-border-subtle);
    --bs-alert-link-color: var(--bs-dark-grey-text);
}

.alert-light-black {
    --bs-alert-color: var(--bs-light-black-text);
    --bs-alert-bg: var(--bs-light-black-bg-subtle);
    --bs-alert-border-color: var(--bs-light-black-border-subtle);
    --bs-alert-link-color: var(--bs-light-black-text);
}

.alert-border-color {
    --bs-alert-color: var(--bs-border-color-text);
    --bs-alert-bg: var(--bs-border-color-bg-subtle);
    --bs-alert-border-color: var(--bs-border-color-border-subtle);
    --bs-alert-link-color: var(--bs-border-color-text);
}

.alert-grey1 {
    --bs-alert-color: var(--bs-grey1-text);
    --bs-alert-bg: var(--bs-grey1-bg-subtle);
    --bs-alert-border-color: var(--bs-grey1-border-subtle);
    --bs-alert-link-color: var(--bs-grey1-text);
}

.alert-grey2 {
    --bs-alert-color: var(--bs-grey2-text);
    --bs-alert-bg: var(--bs-grey2-bg-subtle);
    --bs-alert-border-color: var(--bs-grey2-border-subtle);
    --bs-alert-link-color: var(--bs-grey2-text);
}

.alert-gray-color {
    --bs-alert-color: var(--bs-gray-color-text);
    --bs-alert-bg: var(--bs-gray-color-bg-subtle);
    --bs-alert-border-color: var(--bs-gray-color-border-subtle);
    --bs-alert-link-color: var(--bs-gray-color-text);
}

.alert-gray3 {
    --bs-alert-color: var(--bs-gray3-text);
    --bs-alert-bg: var(--bs-gray3-bg-subtle);
    --bs-alert-border-color: var(--bs-gray3-border-subtle);
    --bs-alert-link-color: var(--bs-gray3-text);
}

.alert-light-grey {
    --bs-alert-color: var(--bs-light-grey-text);
    --bs-alert-bg: var(--bs-light-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-light-grey-border-subtle);
    --bs-alert-link-color: var(--bs-light-grey-text);
}

.bg-primary {
    background: var(--primary) !important;
}

.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
    }

.btn-outline-primary {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary-accent);
}

    .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
        box-shadow: none;
        outline: none;
    }

.text-primary {
    color: var(--primary-accent) !important;
}

.bg-white {
    background: var(--surface) !important;
}

.btn-white {
    background: var(--surface);
    border-color: var(--on-primary);
}

    .btn-white:hover, .btn-white:focus, .btn-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
    }

.btn-outline-white {
    background: transparent;
    border-color: var(--on-primary);
    color: var(--on-primary);
}

    .btn-outline-white:hover, .btn-outline-white:focus, .btn-outline-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
        box-shadow: none;
        outline: none;
    }

.text-white {
    color: var(--on-primary) !important;
}

.bg-black {
    background: var(--black) !important;
}

.btn-black {
    background: var(--black);
    border-color: var(--black);
}

    .btn-black:hover, .btn-black:focus, .btn-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
    }

.btn-outline-black {
    background: transparent;
    border-color: var(--black);
    color: var(--text);
}

    .btn-outline-black:hover, .btn-outline-black:focus, .btn-outline-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
        box-shadow: none;
        outline: none;
    }

.text-black {
    color: var(--text) !important;
}

.bg-secondary {
    background: var(--text-muted) !important;
}

.btn-secondary {
    background: var(--text-muted);
    border-color: var(--text-muted);
}

    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
    }

.btn-outline-secondary {
    background: transparent;
    border-color: var(--text-muted);
    color: var(--text-muted);
}

    .btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
        box-shadow: none;
        outline: none;
    }

.text-secondary {
    color: var(--text-muted) !important;
}

.bg-light-primary {
    background: var(--light-primary) !important;
}

.btn-light-primary {
    background: var(--light-primary);
    border-color: var(--light-primary);
}

    .btn-light-primary:hover, .btn-light-primary:focus, .btn-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
    }

.btn-outline-light-primary {
    background: transparent;
    border-color: var(--light-primary);
    color: var(--light-primary);
}

    .btn-outline-light-primary:hover, .btn-outline-light-primary:focus, .btn-outline-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
        box-shadow: none;
        outline: none;
    }

.text-light-primary {
    color: var(--light-primary) !important;
}

.bg-light-bg {
    background: var(--light-bg) !important;
}

.btn-light-bg {
    background: var(--light-bg);
    border-color: var(--light-bg);
}

    .btn-light-bg:hover, .btn-light-bg:focus, .btn-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
    }

.btn-outline-light-bg {
    background: transparent;
    border-color: var(--light-bg);
    color: var(--light-bg);
}

    .btn-outline-light-bg:hover, .btn-outline-light-bg:focus, .btn-outline-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
        box-shadow: none;
        outline: none;
    }

.text-light-bg {
    color: var(--light-bg) !important;
}

.bg-grey {
    background: var(--grey) !important;
}

.btn-grey {
    background: var(--grey);
    border-color: var(--grey);
}

    .btn-grey:hover, .btn-grey:focus, .btn-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
    }

.btn-outline-grey {
    background: transparent;
    border-color: var(--grey);
    color: var(--grey);
}

    .btn-outline-grey:hover, .btn-outline-grey:focus, .btn-outline-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
        box-shadow: none;
        outline: none;
    }

.text-grey {
    color: var(--grey) !important;
}

.bg-purple {
    background: var(--purple) !important;
}

.btn-purple {
    background: var(--purple);
    border-color: var(--purple);
}

    .btn-purple:hover, .btn-purple:focus, .btn-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
    }

.btn-outline-purple {
    background: transparent;
    border-color: var(--purple);
    color: var(--purple);
}

    .btn-outline-purple:hover, .btn-outline-purple:focus, .btn-outline-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
        box-shadow: none;
        outline: none;
    }

.text-purple {
    color: var(--purple) !important;
}

.bg-dark-purple {
    background: var(--dark-purple) !important;
}

.btn-dark-purple {
    background: var(--dark-purple);
    border-color: var(--dark-purple);
}

    .btn-dark-purple:hover, .btn-dark-purple:focus, .btn-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
    }

.btn-outline-dark-purple {
    background: transparent;
    border-color: var(--dark-purple);
    color: var(--dark-purple);
}

    .btn-outline-dark-purple:hover, .btn-outline-dark-purple:focus, .btn-outline-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
        box-shadow: none;
        outline: none;
    }

.text-dark-purple {
    color: var(--dark-purple) !important;
}

.bg-violet {
    background: var(--violet) !important;
}

.btn-violet {
    background: var(--violet);
    border-color: var(--violet);
}

    .btn-violet:hover, .btn-violet:focus, .btn-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
    }

.btn-outline-violet {
    background: transparent;
    border-color: var(--violet);
    color: var(--primary-accent);
}

    .btn-outline-violet:hover, .btn-outline-violet:focus, .btn-outline-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
        box-shadow: none;
        outline: none;
    }

.text-violet {
    color: var(--primary-accent) !important;
}

.bg-dark-grey {
    background: var(--dark-grey) !important;
}

.btn-dark-grey {
    background: var(--dark-grey);
    border-color: var(--dark-grey);
}

    .btn-dark-grey:hover, .btn-dark-grey:focus, .btn-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
    }

.btn-outline-dark-grey {
    background: transparent;
    border-color: var(--dark-grey);
    color: var(--dark-grey);
}

    .btn-outline-dark-grey:hover, .btn-outline-dark-grey:focus, .btn-outline-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
        box-shadow: none;
        outline: none;
    }

.text-dark-grey {
    color: var(--dark-grey) !important;
}

.bg-light-black {
    background: var(--light-black) !important;
}

.btn-light-black {
    background: var(--light-black);
    border-color: var(--light-black);
}

    .btn-light-black:hover, .btn-light-black:focus, .btn-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
    }

.btn-outline-light-black {
    background: transparent;
    border-color: var(--light-black);
    color: var(--light-black);
}

    .btn-outline-light-black:hover, .btn-outline-light-black:focus, .btn-outline-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
        box-shadow: none;
        outline: none;
    }

.text-light-black {
    color: var(--light-black) !important;
}

.bg-border-color {
    background: var(--border-color) !important;
}

.btn-border-color {
    background: var(--border-color);
    border-color: var(--border-color);
}

    .btn-border-color:hover, .btn-border-color:focus, .btn-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
    }

.btn-outline-border-color {
    background: transparent;
    border-color: var(--border-color);
    color: var(--border-color);
}

    .btn-outline-border-color:hover, .btn-outline-border-color:focus, .btn-outline-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
        box-shadow: none;
        outline: none;
    }

.text-border-color {
    color: var(--border-color) !important;
}

.bg-grey1 {
    background: var(--grey1) !important;
}

.btn-grey1 {
    background: var(--grey1);
    border-color: var(--grey1);
}

    .btn-grey1:hover, .btn-grey1:focus, .btn-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
    }

.btn-outline-grey1 {
    background: transparent;
    border-color: var(--grey1);
    color: var(--grey1);
}

    .btn-outline-grey1:hover, .btn-outline-grey1:focus, .btn-outline-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
        box-shadow: none;
        outline: none;
    }

.text-grey1 {
    color: var(--grey1) !important;
}

.bg-grey2 {
    background: var(--grey2) !important;
}

.btn-grey2 {
    background: var(--grey2);
    border-color: var(--grey2);
}

    .btn-grey2:hover, .btn-grey2:focus, .btn-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
    }

.btn-outline-grey2 {
    background: transparent;
    border-color: var(--grey2);
    color: var(--grey2);
}

    .btn-outline-grey2:hover, .btn-outline-grey2:focus, .btn-outline-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
        box-shadow: none;
        outline: none;
    }

.text-grey2 {
    color: var(--grey2) !important;
}

.bg-gray-color {
    background: var(--gray-color) !important;
}

.btn-gray-color {
    background: var(--gray-color);
    border-color: var(--gray-color);
}

    .btn-gray-color:hover, .btn-gray-color:focus, .btn-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
    }

.btn-outline-gray-color {
    background: transparent;
    border-color: var(--gray-color);
    color: var(--gray-color);
}

    .btn-outline-gray-color:hover, .btn-outline-gray-color:focus, .btn-outline-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
        box-shadow: none;
        outline: none;
    }

.text-gray-color {
    color: var(--gray-color) !important;
}

.bg-gray3 {
    background: var(--gray3) !important;
}

.btn-gray3 {
    background: var(--gray3);
    border-color: var(--gray3);
}

    .btn-gray3:hover, .btn-gray3:focus, .btn-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
    }

.btn-outline-gray3 {
    background: transparent;
    border-color: var(--gray3);
    color: var(--gray3);
}

    .btn-outline-gray3:hover, .btn-outline-gray3:focus, .btn-outline-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
        box-shadow: none;
        outline: none;
    }

.text-gray3 {
    color: var(--gray3) !important;
}

.bg-light-grey {
    background: var(--light-grey) !important;
}

.btn-light-grey {
    background: var(--light-grey);
    border-color: var(--light-grey);
}

    .btn-light-grey:hover, .btn-light-grey:focus, .btn-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
    }

.btn-outline-light-grey {
    background: transparent;
    border-color: var(--light-grey);
    color: var(--light-grey);
}

    .btn-outline-light-grey:hover, .btn-outline-light-grey:focus, .btn-outline-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
        box-shadow: none;
        outline: none;
    }

.text-light-grey {
    color: var(--light-grey) !important;
}

.fs-56 {
    font-size: clamp(30px, 30px + 0vw, 30px);
}

@media (min-width: 768px) {
    .fs-56 {
        font-size: clamp(30px, 30px + 0vw, 30px);
    }
}

@media (min-width: 1200px) {
    .fs-56 {
        font-size: clamp(30px, -13.3333333333px + 3.6111111111vw, 56px);
    }
}

.fs-40 {
    font-size: clamp(18px, 13.7142857143px + 1.3392857143vw, 24px);
}

@media (min-width: 768px) {
    .fs-40 {
        font-size: clamp(24px, 24px + 0vw, 24px);
    }
}

@media (min-width: 1200px) {
    .fs-40 {
        font-size: clamp(24px, -2.6666666667px + 2.2222222222vw, 40px);
    }
}

.fs-38 {
    font-size: clamp(18px, 15.1428571429px + 0.8928571429vw, 22px);
}

@media (min-width: 768px) {
    .fs-38 {
        font-size: clamp(22px, 22px + 0vw, 22px);
    }
}

@media (min-width: 1200px) {
    .fs-38 {
        font-size: clamp(22px, -4.6666666667px + 2.2222222222vw, 38px);
    }
}

.fs-32 {
    font-size: clamp(18px, 16.5714285714px + 0.4464285714vw, 20px);
}

@media (min-width: 768px) {
    .fs-32 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .fs-32 {
        font-size: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.fs-28 {
    font-size: clamp(16px, 14.5714285714px + 0.4464285714vw, 18px);
}

@media (min-width: 768px) {
    .fs-28 {
        font-size: clamp(18px, 18px + 0vw, 18px);
    }
}

@media (min-width: 1200px) {
    .fs-28 {
        font-size: clamp(18px, 1.3333333333px + 1.3888888889vw, 28px);
    }
}

.fs-24 {
    font-size: clamp(16px, 16px + 0vw, 16px);
}

@media (min-width: 768px) {
    .fs-24 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-24 {
        font-size: clamp(16px, 2.6666666667px + 1.1111111111vw, 24px);
    }
}

.fs-22 {
    font-size: clamp(14px, 12.5714285714px + 0.4464285714vw, 16px);
}

@media (min-width: 768px) {
    .fs-22 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-22 {
        font-size: clamp(16px, 6px + 0.8333333333vw, 22px);
    }
}

.fs-20 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-20 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-20 {
        font-size: clamp(12px, -1.3333333333px + 1.1111111111vw, 20px);
    }
}

.fs-18 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-18 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-18 {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

.fs-16 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-16 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-16 {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

.fs-15 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-15 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-15 {
        font-size: clamp(12px, 7px + 0.4166666667vw, 15px);
    }
}

.fs-14 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-14 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-14 {
        font-size: clamp(10px, 3.3333333333px + 0.5555555556vw, 14px);
    }
}

.fs-12 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-12 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-12 {
        font-size: clamp(10px, 6.6666666667px + 0.2777777778vw, 12px);
    }
}

.list-unstyled {
    padding-inline-start: 30px;
}

    .list-unstyled li {
        list-style: none;
        margin-bottom: 8px;
    }

.list-styled-disc {
    padding-inline-start: 30px;
}

    .list-styled-disc li {
        list-style: disc;
        margin-bottom: 8px;
    }

    .list-styled-disc ul {
        padding-inline-start: 30px;
    }

        .list-styled-disc ul li {
            list-style: disc;
            margin-bottom: 8px;
        }

    .list-styled-disc ol {
        padding-inline-start: 30px;
    }

        .list-styled-disc ol li {
            list-style: decimal;
            margin-bottom: 8px;
        }

/*!
* Style Sheet for ""
* version: 1
* last modified:2023 By Applab
* author: Applab
* website: www.applab.qa
*/
.alert-primary {
    --bs-alert-color: var(--bs-primary-text);
    --bs-alert-bg: var(--bs-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-primary-border-subtle);
    --bs-alert-link-color: var(--bs-primary-text);
}

.alert-white {
    --bs-alert-color: var(--bs-white-text);
    --bs-alert-bg: var(--bs-white-bg-subtle);
    --bs-alert-border-color: var(--bs-white-border-subtle);
    --bs-alert-link-color: var(--bs-white-text);
}

.alert-black {
    --bs-alert-color: var(--bs-black-text);
    --bs-alert-bg: var(--bs-black-bg-subtle);
    --bs-alert-border-color: var(--bs-black-border-subtle);
    --bs-alert-link-color: var(--bs-black-text);
}

.alert-secondary {
    --bs-alert-color: var(--bs-secondary-text);
    --bs-alert-bg: var(--bs-secondary-bg-subtle);
    --bs-alert-border-color: var(--bs-secondary-border-subtle);
    --bs-alert-link-color: var(--bs-secondary-text);
}

.alert-light-primary {
    --bs-alert-color: var(--bs-light-primary-text);
    --bs-alert-bg: var(--bs-light-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-light-primary-border-subtle);
    --bs-alert-link-color: var(--bs-light-primary-text);
}

.alert-light-bg {
    --bs-alert-color: var(--bs-light-bg-text);
    --bs-alert-bg: var(--bs-light-bg-bg-subtle);
    --bs-alert-border-color: var(--bs-light-bg-border-subtle);
    --bs-alert-link-color: var(--bs-light-bg-text);
}

.alert-grey {
    --bs-alert-color: var(--bs-grey-text);
    --bs-alert-bg: var(--bs-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-grey-border-subtle);
    --bs-alert-link-color: var(--bs-grey-text);
}

.alert-purple {
    --bs-alert-color: var(--bs-purple-text);
    --bs-alert-bg: var(--bs-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-purple-border-subtle);
    --bs-alert-link-color: var(--bs-purple-text);
}

.alert-dark-purple {
    --bs-alert-color: var(--bs-dark-purple-text);
    --bs-alert-bg: var(--bs-dark-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-purple-border-subtle);
    --bs-alert-link-color: var(--bs-dark-purple-text);
}

.alert-violet {
    --bs-alert-color: var(--bs-violet-text);
    --bs-alert-bg: var(--bs-violet-bg-subtle);
    --bs-alert-border-color: var(--bs-violet-border-subtle);
    --bs-alert-link-color: var(--bs-violet-text);
}

.alert-dark-grey {
    --bs-alert-color: var(--bs-dark-grey-text);
    --bs-alert-bg: var(--bs-dark-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-grey-border-subtle);
    --bs-alert-link-color: var(--bs-dark-grey-text);
}

.alert-light-black {
    --bs-alert-color: var(--bs-light-black-text);
    --bs-alert-bg: var(--bs-light-black-bg-subtle);
    --bs-alert-border-color: var(--bs-light-black-border-subtle);
    --bs-alert-link-color: var(--bs-light-black-text);
}

.alert-border-color {
    --bs-alert-color: var(--bs-border-color-text);
    --bs-alert-bg: var(--bs-border-color-bg-subtle);
    --bs-alert-border-color: var(--bs-border-color-border-subtle);
    --bs-alert-link-color: var(--bs-border-color-text);
}

.alert-grey1 {
    --bs-alert-color: var(--bs-grey1-text);
    --bs-alert-bg: var(--bs-grey1-bg-subtle);
    --bs-alert-border-color: var(--bs-grey1-border-subtle);
    --bs-alert-link-color: var(--bs-grey1-text);
}

.alert-grey2 {
    --bs-alert-color: var(--bs-grey2-text);
    --bs-alert-bg: var(--bs-grey2-bg-subtle);
    --bs-alert-border-color: var(--bs-grey2-border-subtle);
    --bs-alert-link-color: var(--bs-grey2-text);
}

.alert-gray-color {
    --bs-alert-color: var(--bs-gray-color-text);
    --bs-alert-bg: var(--bs-gray-color-bg-subtle);
    --bs-alert-border-color: var(--bs-gray-color-border-subtle);
    --bs-alert-link-color: var(--bs-gray-color-text);
}

.alert-gray3 {
    --bs-alert-color: var(--bs-gray3-text);
    --bs-alert-bg: var(--bs-gray3-bg-subtle);
    --bs-alert-border-color: var(--bs-gray3-border-subtle);
    --bs-alert-link-color: var(--bs-gray3-text);
}

.alert-light-grey {
    --bs-alert-color: var(--bs-light-grey-text);
    --bs-alert-bg: var(--bs-light-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-light-grey-border-subtle);
    --bs-alert-link-color: var(--bs-light-grey-text);
}

.bg-primary {
    background: var(--primary) !important;
}

.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
    }

.btn-outline-primary {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary-accent);
}

    .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
        box-shadow: none;
        outline: none;
    }

.text-primary {
    color: var(--primary-accent) !important;
}

.bg-white {
    background: var(--surface) !important;
}

.btn-white {
    background: var(--surface);
    border-color: var(--on-primary);
}

    .btn-white:hover, .btn-white:focus, .btn-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
    }

.btn-outline-white {
    background: transparent;
    border-color: var(--on-primary);
    color: var(--on-primary);
}

    .btn-outline-white:hover, .btn-outline-white:focus, .btn-outline-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
        box-shadow: none;
        outline: none;
    }

.text-white {
    color: var(--on-primary) !important;
}

.bg-black {
    background: var(--black) !important;
}

.btn-black {
    background: var(--black);
    border-color: var(--black);
}

    .btn-black:hover, .btn-black:focus, .btn-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
    }

.btn-outline-black {
    background: transparent;
    border-color: var(--black);
    color: var(--text);
}

    .btn-outline-black:hover, .btn-outline-black:focus, .btn-outline-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
        box-shadow: none;
        outline: none;
    }

.text-black {
    color: var(--text) !important;
}

.bg-secondary {
    background: var(--text-muted) !important;
}

.btn-secondary {
    background: var(--text-muted);
    border-color: var(--text-muted);
}

    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
    }

.btn-outline-secondary {
    background: transparent;
    border-color: var(--text-muted);
    color: var(--text-muted);
}

    .btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
        box-shadow: none;
        outline: none;
    }

.text-secondary {
    color: var(--text-muted) !important;
}

.bg-light-primary {
    background: var(--light-primary) !important;
}

.btn-light-primary {
    background: var(--light-primary);
    border-color: var(--light-primary);
}

    .btn-light-primary:hover, .btn-light-primary:focus, .btn-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
    }

.btn-outline-light-primary {
    background: transparent;
    border-color: var(--light-primary);
    color: var(--light-primary);
}

    .btn-outline-light-primary:hover, .btn-outline-light-primary:focus, .btn-outline-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
        box-shadow: none;
        outline: none;
    }

.text-light-primary {
    color: var(--light-primary) !important;
}

.bg-light-bg {
    background: var(--light-bg) !important;
}

.btn-light-bg {
    background: var(--light-bg);
    border-color: var(--light-bg);
}

    .btn-light-bg:hover, .btn-light-bg:focus, .btn-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
    }

.btn-outline-light-bg {
    background: transparent;
    border-color: var(--light-bg);
    color: var(--light-bg);
}

    .btn-outline-light-bg:hover, .btn-outline-light-bg:focus, .btn-outline-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
        box-shadow: none;
        outline: none;
    }

.text-light-bg {
    color: var(--light-bg) !important;
}

.bg-grey {
    background: var(--grey) !important;
}

.btn-grey {
    background: var(--grey);
    border-color: var(--grey);
}

    .btn-grey:hover, .btn-grey:focus, .btn-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
    }

.btn-outline-grey {
    background: transparent;
    border-color: var(--grey);
    color: var(--grey);
}

    .btn-outline-grey:hover, .btn-outline-grey:focus, .btn-outline-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
        box-shadow: none;
        outline: none;
    }

.text-grey {
    color: var(--grey) !important;
}

.bg-purple {
    background: var(--purple) !important;
}

.btn-purple {
    background: var(--purple);
    border-color: var(--purple);
}

    .btn-purple:hover, .btn-purple:focus, .btn-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
    }

.btn-outline-purple {
    background: transparent;
    border-color: var(--purple);
    color: var(--purple);
}

    .btn-outline-purple:hover, .btn-outline-purple:focus, .btn-outline-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
        box-shadow: none;
        outline: none;
    }

.text-purple {
    color: var(--purple) !important;
}

.bg-dark-purple {
    background: var(--dark-purple) !important;
}

.btn-dark-purple {
    background: var(--dark-purple);
    border-color: var(--dark-purple);
}

    .btn-dark-purple:hover, .btn-dark-purple:focus, .btn-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
    }

.btn-outline-dark-purple {
    background: transparent;
    border-color: var(--dark-purple);
    color: var(--dark-purple);
}

    .btn-outline-dark-purple:hover, .btn-outline-dark-purple:focus, .btn-outline-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
        box-shadow: none;
        outline: none;
    }

.text-dark-purple {
    color: var(--dark-purple) !important;
}

.bg-violet {
    background: var(--violet) !important;
}

.btn-violet {
    background: var(--violet);
    border-color: var(--violet);
}

    .btn-violet:hover, .btn-violet:focus, .btn-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
    }

.btn-outline-violet {
    background: transparent;
    border-color: var(--violet);
    color: var(--primary-accent);
}

    .btn-outline-violet:hover, .btn-outline-violet:focus, .btn-outline-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
        box-shadow: none;
        outline: none;
    }

.text-violet {
    color: var(--primary-accent) !important;
}

.bg-dark-grey {
    background: var(--dark-grey) !important;
}

.btn-dark-grey {
    background: var(--dark-grey);
    border-color: var(--dark-grey);
}

    .btn-dark-grey:hover, .btn-dark-grey:focus, .btn-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
    }

.btn-outline-dark-grey {
    background: transparent;
    border-color: var(--dark-grey);
    color: var(--dark-grey);
}

    .btn-outline-dark-grey:hover, .btn-outline-dark-grey:focus, .btn-outline-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
        box-shadow: none;
        outline: none;
    }

.text-dark-grey {
    color: var(--dark-grey) !important;
}

.bg-light-black {
    background: var(--light-black) !important;
}

.btn-light-black {
    background: var(--light-black);
    border-color: var(--light-black);
}

    .btn-light-black:hover, .btn-light-black:focus, .btn-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
    }

.btn-outline-light-black {
    background: transparent;
    border-color: var(--light-black);
    color: var(--light-black);
}

    .btn-outline-light-black:hover, .btn-outline-light-black:focus, .btn-outline-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
        box-shadow: none;
        outline: none;
    }

.text-light-black {
    color: var(--light-black) !important;
}

.bg-border-color {
    background: var(--border-color) !important;
}

.btn-border-color {
    background: var(--border-color);
    border-color: var(--border-color);
}

    .btn-border-color:hover, .btn-border-color:focus, .btn-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
    }

.btn-outline-border-color {
    background: transparent;
    border-color: var(--border-color);
    color: var(--border-color);
}

    .btn-outline-border-color:hover, .btn-outline-border-color:focus, .btn-outline-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
        box-shadow: none;
        outline: none;
    }

.text-border-color {
    color: var(--border-color) !important;
}

.bg-grey1 {
    background: var(--grey1) !important;
}

.btn-grey1 {
    background: var(--grey1);
    border-color: var(--grey1);
}

    .btn-grey1:hover, .btn-grey1:focus, .btn-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
    }

.btn-outline-grey1 {
    background: transparent;
    border-color: var(--grey1);
    color: var(--grey1);
}

    .btn-outline-grey1:hover, .btn-outline-grey1:focus, .btn-outline-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
        box-shadow: none;
        outline: none;
    }

.text-grey1 {
    color: var(--grey1) !important;
}

.bg-grey2 {
    background: var(--grey2) !important;
}

.btn-grey2 {
    background: var(--grey2);
    border-color: var(--grey2);
}

    .btn-grey2:hover, .btn-grey2:focus, .btn-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
    }

.btn-outline-grey2 {
    background: transparent;
    border-color: var(--grey2);
    color: var(--grey2);
}

    .btn-outline-grey2:hover, .btn-outline-grey2:focus, .btn-outline-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
        box-shadow: none;
        outline: none;
    }

.text-grey2 {
    color: var(--grey2) !important;
}

.bg-gray-color {
    background: var(--gray-color) !important;
}

.btn-gray-color {
    background: var(--gray-color);
    border-color: var(--gray-color);
}

    .btn-gray-color:hover, .btn-gray-color:focus, .btn-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
    }

.btn-outline-gray-color {
    background: transparent;
    border-color: var(--gray-color);
    color: var(--gray-color);
}

    .btn-outline-gray-color:hover, .btn-outline-gray-color:focus, .btn-outline-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
        box-shadow: none;
        outline: none;
    }

.text-gray-color {
    color: var(--gray-color) !important;
}

.bg-gray3 {
    background: var(--gray3) !important;
}

.btn-gray3 {
    background: var(--gray3);
    border-color: var(--gray3);
}

    .btn-gray3:hover, .btn-gray3:focus, .btn-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
    }

.btn-outline-gray3 {
    background: transparent;
    border-color: var(--gray3);
    color: var(--gray3);
}

    .btn-outline-gray3:hover, .btn-outline-gray3:focus, .btn-outline-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
        box-shadow: none;
        outline: none;
    }

.text-gray3 {
    color: var(--gray3) !important;
}

.bg-light-grey {
    background: var(--light-grey) !important;
}

.btn-light-grey {
    background: var(--light-grey);
    border-color: var(--light-grey);
}

    .btn-light-grey:hover, .btn-light-grey:focus, .btn-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
    }

.btn-outline-light-grey {
    background: transparent;
    border-color: var(--light-grey);
    color: var(--light-grey);
}

    .btn-outline-light-grey:hover, .btn-outline-light-grey:focus, .btn-outline-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
        box-shadow: none;
        outline: none;
    }

.text-light-grey {
    color: var(--light-grey) !important;
}

.fs-56 {
    font-size: clamp(30px, 30px + 0vw, 30px);
}

@media (min-width: 768px) {
    .fs-56 {
        font-size: clamp(30px, 30px + 0vw, 30px);
    }
}

@media (min-width: 1200px) {
    .fs-56 {
        font-size: clamp(30px, -13.3333333333px + 3.6111111111vw, 56px);
    }
}

.fs-40 {
    font-size: clamp(18px, 13.7142857143px + 1.3392857143vw, 24px);
}

@media (min-width: 768px) {
    .fs-40 {
        font-size: clamp(24px, 24px + 0vw, 24px);
    }
}

@media (min-width: 1200px) {
    .fs-40 {
        font-size: clamp(24px, -2.6666666667px + 2.2222222222vw, 40px);
    }
}

.fs-38 {
    font-size: clamp(18px, 15.1428571429px + 0.8928571429vw, 22px);
}

@media (min-width: 768px) {
    .fs-38 {
        font-size: clamp(22px, 22px + 0vw, 22px);
    }
}

@media (min-width: 1200px) {
    .fs-38 {
        font-size: clamp(22px, -4.6666666667px + 2.2222222222vw, 38px);
    }
}

.fs-32 {
    font-size: clamp(18px, 16.5714285714px + 0.4464285714vw, 20px);
}

@media (min-width: 768px) {
    .fs-32 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .fs-32 {
        font-size: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.fs-28 {
    font-size: clamp(16px, 14.5714285714px + 0.4464285714vw, 18px);
}

@media (min-width: 768px) {
    .fs-28 {
        font-size: clamp(18px, 18px + 0vw, 18px);
    }
}

@media (min-width: 1200px) {
    .fs-28 {
        font-size: clamp(18px, 1.3333333333px + 1.3888888889vw, 28px);
    }
}

.fs-24 {
    font-size: clamp(16px, 16px + 0vw, 16px);
}

@media (min-width: 768px) {
    .fs-24 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-24 {
        font-size: clamp(16px, 2.6666666667px + 1.1111111111vw, 24px);
    }
}

.fs-22 {
    font-size: clamp(14px, 12.5714285714px + 0.4464285714vw, 16px);
}

@media (min-width: 768px) {
    .fs-22 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-22 {
        font-size: clamp(16px, 6px + 0.8333333333vw, 22px);
    }
}

.fs-20 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-20 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-20 {
        font-size: clamp(12px, -1.3333333333px + 1.1111111111vw, 20px);
    }
}

.fs-18 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-18 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-18 {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

.fs-16 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-16 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-16 {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

.fs-15 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-15 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-15 {
        font-size: clamp(12px, 7px + 0.4166666667vw, 15px);
    }
}

.fs-14 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-14 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-14 {
        font-size: clamp(10px, 3.3333333333px + 0.5555555556vw, 14px);
    }
}

.fs-12 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-12 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-12 {
        font-size: clamp(10px, 6.6666666667px + 0.2777777778vw, 12px);
    }
}

.form-wrapper .form-group .iti {
    width: 100%;
}



.form-wrapper .form-group .iti {
    width: 100%;
}

html[dir=rtl] .form-wrapper .form-group .iti__country-container {
    right: 0 !important;
}

.form-wrapper .form-group .iti input::placeholder {
    color: var(--placeholder-color);
}

.form-wrapper .form-control {
    padding: 12px 10px;
    height: 51px;
    border: 1px solid var(--border-color-2);
    box-shadow: 0px 1px 2px rgba(10, 13, 18, 0.05);
    border-radius: 4px;
    color: var(--black-1);
    font-size: 16px;
    font-weight: 400;
    transition: border-color 0.3s ease-in-out;
}

    .form-wrapper .form-control::placeholder {
        color: var(--placeholder-color);
    }

    .form-wrapper .form-control:focus {
        border-color: var(--primary);
    }

.form-wrapper .form select.form-control:invalid {
    color: var(--placeholder-color);
}

.form-wrapper .form select.form-control:valid {
    color: var(--black-1);
}

.form-wrapper .form select.form-control option[value=""] {
    color: var(--placeholder-color);
}

.form-wrapper .form select.form-control option:not([value=""]) {
    color: var(--black-1);
}

.form-wrapper .form-check {
    width: 24px;
    height: 24px;
    border-color: var(--text-muted);
    accent-color: var(--primary);
}

.form-wrapper .form-check-input {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    border: 0;
    margin-bottom: 24px;
}

.form-wrapper label {
    color: var(--text-muted);
    font-size: 12px;
    font-weight: 400;
    text-align: start;
    border: 0;
    margin-bottom: 8px;
    padding: 0;
}

.form-wrapper textarea {
    height: auto !important;
}

.form-wrapper select {
    appearance: auto;
}

.form-wrapper .input-btn {
    font-weight: 500;
    font-size: 16px;
    color: var(--black-1);
}

.form-wrapper .primary-btn {
    background-color: var(--primary);
    color: var(--on-primary);
}

.upload-files-container {
    width: 100%;
    height: auto !important;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border-style: dashed !important;
    border-color: var(--border) !important;
}

    .upload-files-container .dropzone-area {
        width: 100%;
        text-align: center;
        cursor: pointer;
        padding: 16px 16px !important;
    }

        .upload-files-container .dropzone-area h3 {
            color: var(--text-muted);
            font-style: normal;
            font-weight: 400;
            font-size: 14px;
            line-height: 20px;
            text-align: center;
            margin-bottom: 0;
        }

            .upload-files-container .dropzone-area h3 label {
                margin-bottom: 0;
            }

        .upload-files-container .dropzone-area .browse-files {
            margin-inline-start: 0 !important;
        }

        .upload-files-container .dropzone-area .browse-files-text {
            color: var(--primary-accent);
            font-weight: 400;
            font-size: 14px;
            cursor: pointer;
            margin-inline-start: 0 !important;
            text-decoration: underline;
        }

        .upload-files-container .dropzone-area .default-file-input {
            opacity: 0;
            width: 0;
        }

.file-upload-wrapper .selected-files-area {
    width: 100%;
    text-align: start;
    margin-top: 12px;
}

.file-upload-wrapper .selected-files-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 4px;
    padding: 10px 12px;
    background-color: var(--surface-3);
    border-radius: 4px;
}

.file-upload-wrapper .selected-files-label {
    color: var(--text-muted);
    font-size: 14px;
    font-weight: 400;
}

.file-upload-wrapper .change-file-link {
    color: var(--primary-accent);
    font-size: 14px;
    font-weight: 400;
    text-decoration: underline;
    cursor: pointer;
}

    .file-upload-wrapper .change-file-link:hover {
        color: var(--primary-accent);
    }

.file-upload-wrapper .selected-files-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.file-upload-wrapper .selected-file-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 0;
    font-size: 14px;
    color: var(--text-muted);
    padding: 10px 12px;
    background-color: var(--surface-3);
    border-radius: 4px;
    margin-bottom: 2px;
}

.file-upload-wrapper .remove-file-btn {
    margin-left: auto;
    background: none;
    border: none;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    color: #888;
}

    .file-upload-wrapper .remove-file-btn:hover {
        color: #e00;
    }

.file-upload-wrapper .selected-file-icon {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    background: url("../../assets/images/pdf-icon.svg") no-repeat center;
    background-size: contain;
}

.file-upload-wrapper .selected-file-name {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.file-upload-wrapper.has-files .selected-files-area {
    display: block !important;
}

.select2-box {
    min-width: 170px;
}

    .select2-box .select2-container--default .select2-selection--single {
        border: none;
        border-radius: 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

        .select2-box .select2-container--default .select2-selection--single .select2-selection__rendered {
            line-height: unset;
            font-weight: 500;
            font-size: 16px;
            color: var(--primary-accent);
        }

        .select2-box .select2-container--default .select2-selection--single .select2-selection__arrow b {
            border: none;
            background-image: url(../../assets/images/down-arrow.svg);
            background-repeat: no-repeat;
            background-size: cover;
            width: 12px;
            height: 7px;
            margin-top: 0;
            position: inherit;
        }

        .select2-box .select2-container--default .select2-selection--single .select2-selection__arrow {
            position: inherit;
            display: flex;
            align-items: center;
            width: auto;
            height: auto;
        }

    .select2-box .select2-container--open .select2-selection__arrow b {
        transform: rotate(180deg);
    }

.select2-container--open .select2-dropdown--below {
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
    border: none;
    border-radius: 16px;
}

.select2-dropdown {
    padding: 0px;
    min-width: 160px !important;
    box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.0588235294);
    left: -19px;
    margin-top: 15px;
}

.select2-results__option {
    padding: 10px;
    font-size: 14px;
    font-weight: 500;
    color: var(--text);
}

.select2-results__options li:first-child {
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
}

.select2-results__options li:last-child {
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
}

.select2-container--default .select2-results > .select2-results__options {
    max-height: 240px;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: var(--surface);
    color: var(--primary-accent);
}

.select2-container--default .select2-results__option--selected {
    background-color: transparent;
}

.changestyle:hover {
    border-color: var(--border-color) !important;
    box-shadow: none !important;
}

.changestyle .card-body {
    position: relative;
    z-index: 9;
}

.changestyle .card-text {
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
}

.changestyle .btn {
    width: max-content !important;
    padding: 16px 32px 18px !important;
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .changestyle .btn {
        padding: 16px !important;
    }
}

.changestyle.card-second::after {
    background-image: url(../../assets/images/people-1.png) !important;
    background-size: 22% !important;
}

@media (max-width: 767.98px) {
    .changestyle.card-second::after {
        background-size: 15%;
    }
}

html[dir=rtl] .changestyle.card-second::after {
    transform: scaleX(-1);
}

.changestyle#client::after {
    background-image: url(../../assets/images/icons/people.png);
    background-size: 25%;
}

@media (max-width: 767.98px) {
    .changestyle#client::after {
        background-size: 15%;
    }
}

html[dir=rtl] .changestyle#client::after {
    transform: scaleX(-1);
}

.card-wrapper .card {
    flex: 1 1 0;
    min-width: 0;
}

@media (max-width: 767.98px) {
    .card-wrapper {
        flex-direction: column;
    }
}

.contact-map {
    border-radius: 16px;
    position: relative;
}

.contact-map-popup {
    padding: 24px;
    background-color: var(--surface);
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    position: absolute;
    bottom: 24px;
    inset-inline-start: 24px;
    width: 380px;
}

    .contact-map-popup p {
        display: flex;
        gap: 16px;
        align-items: center;
    }

        .contact-map-popup p img {
            height: 16px;
        }

.contact-form {
    padding-inline-end: 40px;
}

@media (max-width: 767.98px) {
    .contact-form {
        padding-inline-end: 0;
    }
}

.contact-phone p, .contact-fax p, .contact-email p {
    cursor: pointer;
}

.form-group:has(.radio-label) {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 0 !important;
}

@media (max-width: 767.98px) {
    .form-group:has(.radio-label) {
        gap: 12px;
    }
}

.radio-wrapper {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    gap: 8px 16px;
}

    /* In narrow (multi-column) cells: label on its own line, options on the next line */
    .radio-wrapper.stacked {
        flex-direction: column;
        align-items: flex-start;
    }

.radio-group {
    display: flex;
    gap: 12px 12px;
    align-items: center;
    margin-top: 0;
    flex-wrap: wrap;
}

@media (max-width: 767.98px) {
    .radio-group {
        gap: 16px;
    }
}

.radio-option {
    display: flex;
    align-items: center;
    gap: 8px;
}

.radio-label {
    color: var(--text-muted);
    font-weight: 400;
    margin-bottom: 0 !important;
}

.radio-label-text {
    color: var(--purple);
    font-weight: 400;
    margin-bottom: 0 !important;
    cursor: pointer;
    user-select: none;
}

.radio-input {
    appearance: none;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    border: 2px solid var(--black);
    border-radius: 50%;
    background-color: var(--surface);
    cursor: pointer;
    position: relative;
    transition: all 0.2s ease;
}

    .radio-input:checked {
        background-color: rgba(96, 63, 131, 0.2);
        border-color: var(--black);
    }

        .radio-input:checked::after {
            content: "";
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 10px;
            height: 10px;
            border-radius: 50%;
            background-color: var(--black);
        }

    .radio-input:hover {
        border-color: var(--purple);
    }

    .radio-input:focus {
        outline: none;
    }

#submitPopup {
    width: 50%;
    padding: 25px 20px;
    z-index: 99999 !important;
    height: 77%;
    max-height: 100%;
}

@media (max-width: 767.98px) {
    #submitPopup {
        width: 100%;
        height: 100%;
        padding: 20px 15px;
    }
}

#submitPopup .offcanvas-header {
    position: absolute;
    inset-inline-end: 38px;
    padding: 0;
}

    #submitPopup .offcanvas-header .btn-close {
        border-radius: 50%;
        border: 1px solid var(--secondary);
        padding: 17px;
    }

#submitPopup .offcanvas-body {
    padding: 0;
    overflow-x: hidden;
    overflow-y: auto;
}

    #submitPopup .offcanvas-body .contact-form {
        padding-inline-end: 0;
    }

.contact-form .btn {
    padding: 15px 30px !important;
}

.contact-form .form-check-input {
    display: flex;
    align-items: center;
    gap: 12px;
}

    .contact-form .form-check-input .contact-checkbox-box {
        display: inline-flex;
        flex-shrink: 0;
        width: 24px;
        height: 24px;
        flex: 0 0 24px;
    }

        .contact-form .form-check-input .contact-checkbox-box input.form-check,
        .contact-form .form-check-input .contact-checkbox-box input[type=checkbox] {
            width: 100% !important;
            height: 100% !important;
            min-width: 100% !important;
            min-height: 100% !important;
            max-width: 100% !important;
            max-height: 100% !important;
        }

    .contact-form .form-check-input input.form-check,
    .contact-form .form-check-input input[type=checkbox] {
        appearance: none;
        -webkit-appearance: none;
        flex: 0 0 24px;
        border: 2px solid var(--text-muted) !important;
        border-radius: 0px;
        background-color: var(--surface);
        cursor: pointer;
        flex-shrink: 0;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }

        .contact-form .form-check-input input.form-check:checked,
        .contact-form .form-check-input input[type=checkbox]:checked {
            background-color: var(--primary);
            border-color: var(--primary) !important;
            background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
        }

        .contact-form .form-check-input input.form-check:focus,
        .contact-form .form-check-input input[type=checkbox]:focus {
            border-color: var(--primary) !important;
        }

.contact-form .contact-form-checkbox-col + .contact-form-checkbox-col {
    margin-top: -0.5rem;
}

.contact-form .contact-form-checkbox-col label {
    font-size: 14px !important;
}

.card.card-list.newsletter.contact.changestyle .btn-transparent {
    border: 1px solid var(--primary);
}

/*!
* Style Sheet for ""
* version: 1
* last modified:2023 By Applab
* author: Applab
* website: www.applab.qa
*/
.alert-primary {
    --bs-alert-color: var(--bs-primary-text);
    --bs-alert-bg: var(--bs-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-primary-border-subtle);
    --bs-alert-link-color: var(--bs-primary-text);
}

.alert-white {
    --bs-alert-color: var(--bs-white-text);
    --bs-alert-bg: var(--bs-white-bg-subtle);
    --bs-alert-border-color: var(--bs-white-border-subtle);
    --bs-alert-link-color: var(--bs-white-text);
}

.alert-black {
    --bs-alert-color: var(--bs-black-text);
    --bs-alert-bg: var(--bs-black-bg-subtle);
    --bs-alert-border-color: var(--bs-black-border-subtle);
    --bs-alert-link-color: var(--bs-black-text);
}

.alert-secondary {
    --bs-alert-color: var(--bs-secondary-text);
    --bs-alert-bg: var(--bs-secondary-bg-subtle);
    --bs-alert-border-color: var(--bs-secondary-border-subtle);
    --bs-alert-link-color: var(--bs-secondary-text);
}

.alert-light-primary {
    --bs-alert-color: var(--bs-light-primary-text);
    --bs-alert-bg: var(--bs-light-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-light-primary-border-subtle);
    --bs-alert-link-color: var(--bs-light-primary-text);
}

.alert-light-bg {
    --bs-alert-color: var(--bs-light-bg-text);
    --bs-alert-bg: var(--bs-light-bg-bg-subtle);
    --bs-alert-border-color: var(--bs-light-bg-border-subtle);
    --bs-alert-link-color: var(--bs-light-bg-text);
}

.alert-grey {
    --bs-alert-color: var(--bs-grey-text);
    --bs-alert-bg: var(--bs-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-grey-border-subtle);
    --bs-alert-link-color: var(--bs-grey-text);
}

.alert-purple {
    --bs-alert-color: var(--bs-purple-text);
    --bs-alert-bg: var(--bs-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-purple-border-subtle);
    --bs-alert-link-color: var(--bs-purple-text);
}

.alert-dark-purple {
    --bs-alert-color: var(--bs-dark-purple-text);
    --bs-alert-bg: var(--bs-dark-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-purple-border-subtle);
    --bs-alert-link-color: var(--bs-dark-purple-text);
}

.alert-violet {
    --bs-alert-color: var(--bs-violet-text);
    --bs-alert-bg: var(--bs-violet-bg-subtle);
    --bs-alert-border-color: var(--bs-violet-border-subtle);
    --bs-alert-link-color: var(--bs-violet-text);
}

.alert-dark-grey {
    --bs-alert-color: var(--bs-dark-grey-text);
    --bs-alert-bg: var(--bs-dark-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-grey-border-subtle);
    --bs-alert-link-color: var(--bs-dark-grey-text);
}

.alert-light-black {
    --bs-alert-color: var(--bs-light-black-text);
    --bs-alert-bg: var(--bs-light-black-bg-subtle);
    --bs-alert-border-color: var(--bs-light-black-border-subtle);
    --bs-alert-link-color: var(--bs-light-black-text);
}

.alert-border-color {
    --bs-alert-color: var(--bs-border-color-text);
    --bs-alert-bg: var(--bs-border-color-bg-subtle);
    --bs-alert-border-color: var(--bs-border-color-border-subtle);
    --bs-alert-link-color: var(--bs-border-color-text);
}

.alert-grey1 {
    --bs-alert-color: var(--bs-grey1-text);
    --bs-alert-bg: var(--bs-grey1-bg-subtle);
    --bs-alert-border-color: var(--bs-grey1-border-subtle);
    --bs-alert-link-color: var(--bs-grey1-text);
}

.alert-grey2 {
    --bs-alert-color: var(--bs-grey2-text);
    --bs-alert-bg: var(--bs-grey2-bg-subtle);
    --bs-alert-border-color: var(--bs-grey2-border-subtle);
    --bs-alert-link-color: var(--bs-grey2-text);
}

.alert-gray-color {
    --bs-alert-color: var(--bs-gray-color-text);
    --bs-alert-bg: var(--bs-gray-color-bg-subtle);
    --bs-alert-border-color: var(--bs-gray-color-border-subtle);
    --bs-alert-link-color: var(--bs-gray-color-text);
}

.alert-gray3 {
    --bs-alert-color: var(--bs-gray3-text);
    --bs-alert-bg: var(--bs-gray3-bg-subtle);
    --bs-alert-border-color: var(--bs-gray3-border-subtle);
    --bs-alert-link-color: var(--bs-gray3-text);
}

.alert-light-grey {
    --bs-alert-color: var(--bs-light-grey-text);
    --bs-alert-bg: var(--bs-light-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-light-grey-border-subtle);
    --bs-alert-link-color: var(--bs-light-grey-text);
}

.bg-primary {
    background: var(--primary) !important;
}

.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
    }

.btn-outline-primary {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary-accent);
}

    .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
        box-shadow: none;
        outline: none;
    }

.text-primary {
    color: var(--primary-accent) !important;
}

.bg-white {
    background: var(--surface) !important;
}

.btn-white {
    background: var(--surface);
    border-color: var(--on-primary);
}

    .btn-white:hover, .btn-white:focus, .btn-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
    }

.btn-outline-white {
    background: transparent;
    border-color: var(--on-primary);
    color: var(--on-primary);
}

    .btn-outline-white:hover, .btn-outline-white:focus, .btn-outline-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
        box-shadow: none;
        outline: none;
    }

.text-white {
    color: var(--on-primary) !important;
}

.bg-black {
    background: var(--black) !important;
}

.btn-black {
    background: var(--black);
    border-color: var(--black);
}

    .btn-black:hover, .btn-black:focus, .btn-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
    }

.btn-outline-black {
    background: transparent;
    border-color: var(--black);
    color: var(--text);
}

    .btn-outline-black:hover, .btn-outline-black:focus, .btn-outline-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
        box-shadow: none;
        outline: none;
    }

.text-black {
    color: var(--text) !important;
}

.bg-secondary {
    background: var(--text-muted) !important;
}

.btn-secondary {
    background: var(--text-muted);
    border-color: var(--text-muted);
}

    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
    }

.btn-outline-secondary {
    background: transparent;
    border-color: var(--text-muted);
    color: var(--text-muted);
}

    .btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
        box-shadow: none;
        outline: none;
    }

.text-secondary {
    color: var(--text-muted) !important;
}

.bg-light-primary {
    background: var(--light-primary) !important;
}

.btn-light-primary {
    background: var(--light-primary);
    border-color: var(--light-primary);
}

    .btn-light-primary:hover, .btn-light-primary:focus, .btn-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
    }

.btn-outline-light-primary {
    background: transparent;
    border-color: var(--light-primary);
    color: var(--light-primary);
}

    .btn-outline-light-primary:hover, .btn-outline-light-primary:focus, .btn-outline-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
        box-shadow: none;
        outline: none;
    }

.text-light-primary {
    color: var(--light-primary) !important;
}

.bg-light-bg {
    background: var(--light-bg) !important;
}

.btn-light-bg {
    background: var(--light-bg);
    border-color: var(--light-bg);
}

    .btn-light-bg:hover, .btn-light-bg:focus, .btn-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
    }

.btn-outline-light-bg {
    background: transparent;
    border-color: var(--light-bg);
    color: var(--light-bg);
}

    .btn-outline-light-bg:hover, .btn-outline-light-bg:focus, .btn-outline-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
        box-shadow: none;
        outline: none;
    }

.text-light-bg {
    color: var(--light-bg) !important;
}

.bg-grey {
    background: var(--grey) !important;
}

.btn-grey {
    background: var(--grey);
    border-color: var(--grey);
}

    .btn-grey:hover, .btn-grey:focus, .btn-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
    }

.btn-outline-grey {
    background: transparent;
    border-color: var(--grey);
    color: var(--grey);
}

    .btn-outline-grey:hover, .btn-outline-grey:focus, .btn-outline-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
        box-shadow: none;
        outline: none;
    }

.text-grey {
    color: var(--grey) !important;
}

.bg-purple {
    background: var(--purple) !important;
}

.btn-purple {
    background: var(--purple);
    border-color: var(--purple);
}

    .btn-purple:hover, .btn-purple:focus, .btn-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
    }

.btn-outline-purple {
    background: transparent;
    border-color: var(--purple);
    color: var(--purple);
}

    .btn-outline-purple:hover, .btn-outline-purple:focus, .btn-outline-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
        box-shadow: none;
        outline: none;
    }

.text-purple {
    color: var(--purple) !important;
}

.bg-dark-purple {
    background: var(--dark-purple) !important;
}

.btn-dark-purple {
    background: var(--dark-purple);
    border-color: var(--dark-purple);
}

    .btn-dark-purple:hover, .btn-dark-purple:focus, .btn-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
    }

.btn-outline-dark-purple {
    background: transparent;
    border-color: var(--dark-purple);
    color: var(--dark-purple);
}

    .btn-outline-dark-purple:hover, .btn-outline-dark-purple:focus, .btn-outline-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
        box-shadow: none;
        outline: none;
    }

.text-dark-purple {
    color: var(--dark-purple) !important;
}

.bg-violet {
    background: var(--violet) !important;
}

.btn-violet {
    background: var(--violet);
    border-color: var(--violet);
}

    .btn-violet:hover, .btn-violet:focus, .btn-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
    }

.btn-outline-violet {
    background: transparent;
    border-color: var(--violet);
    color: var(--primary-accent);
}

    .btn-outline-violet:hover, .btn-outline-violet:focus, .btn-outline-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
        box-shadow: none;
        outline: none;
    }

.text-violet {
    color: var(--primary-accent) !important;
}

.bg-dark-grey {
    background: var(--dark-grey) !important;
}

.btn-dark-grey {
    background: var(--dark-grey);
    border-color: var(--dark-grey);
}

    .btn-dark-grey:hover, .btn-dark-grey:focus, .btn-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
    }

.btn-outline-dark-grey {
    background: transparent;
    border-color: var(--dark-grey);
    color: var(--dark-grey);
}

    .btn-outline-dark-grey:hover, .btn-outline-dark-grey:focus, .btn-outline-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
        box-shadow: none;
        outline: none;
    }

.text-dark-grey {
    color: var(--dark-grey) !important;
}

.bg-light-black {
    background: var(--light-black) !important;
}

.btn-light-black {
    background: var(--light-black);
    border-color: var(--light-black);
}

    .btn-light-black:hover, .btn-light-black:focus, .btn-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
    }

.btn-outline-light-black {
    background: transparent;
    border-color: var(--light-black);
    color: var(--light-black);
}

    .btn-outline-light-black:hover, .btn-outline-light-black:focus, .btn-outline-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
        box-shadow: none;
        outline: none;
    }

.text-light-black {
    color: var(--light-black) !important;
}

.bg-border-color {
    background: var(--border-color) !important;
}

.btn-border-color {
    background: var(--border-color);
    border-color: var(--border-color);
}

    .btn-border-color:hover, .btn-border-color:focus, .btn-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
    }

.btn-outline-border-color {
    background: transparent;
    border-color: var(--border-color);
    color: var(--border-color);
}

    .btn-outline-border-color:hover, .btn-outline-border-color:focus, .btn-outline-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
        box-shadow: none;
        outline: none;
    }

.text-border-color {
    color: var(--border-color) !important;
}

.bg-grey1 {
    background: var(--grey1) !important;
}

.btn-grey1 {
    background: var(--grey1);
    border-color: var(--grey1);
}

    .btn-grey1:hover, .btn-grey1:focus, .btn-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
    }

.btn-outline-grey1 {
    background: transparent;
    border-color: var(--grey1);
    color: var(--grey1);
}

    .btn-outline-grey1:hover, .btn-outline-grey1:focus, .btn-outline-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
        box-shadow: none;
        outline: none;
    }

.text-grey1 {
    color: var(--grey1) !important;
}

.bg-grey2 {
    background: var(--grey2) !important;
}

.btn-grey2 {
    background: var(--grey2);
    border-color: var(--grey2);
}

    .btn-grey2:hover, .btn-grey2:focus, .btn-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
    }

.btn-outline-grey2 {
    background: transparent;
    border-color: var(--grey2);
    color: var(--grey2);
}

    .btn-outline-grey2:hover, .btn-outline-grey2:focus, .btn-outline-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
        box-shadow: none;
        outline: none;
    }

.text-grey2 {
    color: var(--grey2) !important;
}

.bg-gray-color {
    background: var(--gray-color) !important;
}

.btn-gray-color {
    background: var(--gray-color);
    border-color: var(--gray-color);
}

    .btn-gray-color:hover, .btn-gray-color:focus, .btn-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
    }

.btn-outline-gray-color {
    background: transparent;
    border-color: var(--gray-color);
    color: var(--gray-color);
}

    .btn-outline-gray-color:hover, .btn-outline-gray-color:focus, .btn-outline-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
        box-shadow: none;
        outline: none;
    }

.text-gray-color {
    color: var(--gray-color) !important;
}

.bg-gray3 {
    background: var(--gray3) !important;
}

.btn-gray3 {
    background: var(--gray3);
    border-color: var(--gray3);
}

    .btn-gray3:hover, .btn-gray3:focus, .btn-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
    }

.btn-outline-gray3 {
    background: transparent;
    border-color: var(--gray3);
    color: var(--gray3);
}

    .btn-outline-gray3:hover, .btn-outline-gray3:focus, .btn-outline-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
        box-shadow: none;
        outline: none;
    }

.text-gray3 {
    color: var(--gray3) !important;
}

.bg-light-grey {
    background: var(--light-grey) !important;
}

.btn-light-grey {
    background: var(--light-grey);
    border-color: var(--light-grey);
}

    .btn-light-grey:hover, .btn-light-grey:focus, .btn-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
    }

.btn-outline-light-grey {
    background: transparent;
    border-color: var(--light-grey);
    color: var(--light-grey);
}

    .btn-outline-light-grey:hover, .btn-outline-light-grey:focus, .btn-outline-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
        box-shadow: none;
        outline: none;
    }

.text-light-grey {
    color: var(--light-grey) !important;
}

.fs-56 {
    font-size: clamp(30px, 30px + 0vw, 30px);
}

@media (min-width: 768px) {
    .fs-56 {
        font-size: clamp(30px, 30px + 0vw, 30px);
    }
}

@media (min-width: 1200px) {
    .fs-56 {
        font-size: clamp(30px, -13.3333333333px + 3.6111111111vw, 56px);
    }
}

.fs-40 {
    font-size: clamp(18px, 13.7142857143px + 1.3392857143vw, 24px);
}

@media (min-width: 768px) {
    .fs-40 {
        font-size: clamp(24px, 24px + 0vw, 24px);
    }
}

@media (min-width: 1200px) {
    .fs-40 {
        font-size: clamp(24px, -2.6666666667px + 2.2222222222vw, 40px);
    }
}

.fs-38 {
    font-size: clamp(18px, 15.1428571429px + 0.8928571429vw, 22px);
}

@media (min-width: 768px) {
    .fs-38 {
        font-size: clamp(22px, 22px + 0vw, 22px);
    }
}

@media (min-width: 1200px) {
    .fs-38 {
        font-size: clamp(22px, -4.6666666667px + 2.2222222222vw, 38px);
    }
}

.fs-32 {
    font-size: clamp(18px, 16.5714285714px + 0.4464285714vw, 20px);
}

@media (min-width: 768px) {
    .fs-32 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .fs-32 {
        font-size: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.fs-28 {
    font-size: clamp(16px, 14.5714285714px + 0.4464285714vw, 18px);
}

@media (min-width: 768px) {
    .fs-28 {
        font-size: clamp(18px, 18px + 0vw, 18px);
    }
}

@media (min-width: 1200px) {
    .fs-28 {
        font-size: clamp(18px, 1.3333333333px + 1.3888888889vw, 28px);
    }
}

.fs-24 {
    font-size: clamp(16px, 16px + 0vw, 16px);
}

@media (min-width: 768px) {
    .fs-24 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-24 {
        font-size: clamp(16px, 2.6666666667px + 1.1111111111vw, 24px);
    }
}

.fs-22 {
    font-size: clamp(14px, 12.5714285714px + 0.4464285714vw, 16px);
}

@media (min-width: 768px) {
    .fs-22 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-22 {
        font-size: clamp(16px, 6px + 0.8333333333vw, 22px);
    }
}

.fs-20 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-20 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-20 {
        font-size: clamp(12px, -1.3333333333px + 1.1111111111vw, 20px);
    }
}

.fs-18 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-18 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-18 {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

.fs-16 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-16 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-16 {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

.fs-15 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-15 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-15 {
        font-size: clamp(12px, 7px + 0.4166666667vw, 15px);
    }
}

.fs-14 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-14 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-14 {
        font-size: clamp(10px, 3.3333333333px + 0.5555555556vw, 14px);
    }
}

.fs-12 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-12 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-12 {
        font-size: clamp(10px, 6.6666666667px + 0.2777777778vw, 12px);
    }
}

.section-title {
    text-align: start;
}

@media (max-width: 767.98px) {
    .section-title {
        margin-bottom: 24px !important;
    }
}

@media (max-width: 991.98px) {
    .section-title {
        padding-inline: 0 !important;
    }
}

.sub-title {
    text-transform: none;
    text-align: start;
    color: var(--text-muted);
}

.breadcrumb-menu {
    background-color: var(--surface-2);
    border: 1px solid var(--border-color);
    padding: 18px 0;
}

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
        content: var(--bs-breadcrumb-divider, ">");
        color: var(--purple);
        float: inline-start !important;
        padding-inline-end: var(--bs-breadcrumb-item-padding-x) !important;
    }

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item a {
        font-weight: 400;
        font-size: 16px;
        line-height: 19px;
        letter-spacing: -0.18px;
        color: var(--text-muted);
    }

        .breadcrumb-menu nav .breadcrumb .breadcrumb-item a.active {
            color: var(--purple);
        }

.reporting-channels ul {
    padding-left: 20px;
}

    .reporting-channels ul li {
        margin-bottom: 3px;
        list-style: disc;
    }

        .reporting-channels ul li:last-child {
            margin-bottom: 0;
        }

.reporting-channels a.btn {
    margin-top: 20px;
}

/* both columns stretch to the tallest one, and the text area takes the slack so
   the buttons line up on the same baseline instead of following their own text */
.reporting-channels .row > [class*="col-"] {
    display: flex;
    flex-direction: column;
}

    .reporting-channels .row > [class*="col-"] > .rich-text-list {
        flex: 1 1 auto;
    }

    .reporting-channels .row a.btn {
        align-self: flex-start;
    }

.about-us .video-container {
    overflow: hidden;
    --bs-aspect-ratio: 58.15%;
}

    .about-us .video-container .video-btn {
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }

        .about-us .video-container .video-btn.bottom-right {
            top: unset;
            left: unset;
            inset-inline-start: 32px;
            inset-block-end: 32px;
            transform: unset;
        }

.empowering .ratio {
    --bs-aspect-ratio: 58.15%;
}

/*!
* Style Sheet for ""
* version: 1
* last modified:2023 By Applab
* author: Applab
* website: www.applab.qa
*/
.alert-primary {
    --bs-alert-color: var(--bs-primary-text);
    --bs-alert-bg: var(--bs-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-primary-border-subtle);
    --bs-alert-link-color: var(--bs-primary-text);
}

.alert-white {
    --bs-alert-color: var(--bs-white-text);
    --bs-alert-bg: var(--bs-white-bg-subtle);
    --bs-alert-border-color: var(--bs-white-border-subtle);
    --bs-alert-link-color: var(--bs-white-text);
}

.alert-black {
    --bs-alert-color: var(--bs-black-text);
    --bs-alert-bg: var(--bs-black-bg-subtle);
    --bs-alert-border-color: var(--bs-black-border-subtle);
    --bs-alert-link-color: var(--bs-black-text);
}

.alert-secondary {
    --bs-alert-color: var(--bs-secondary-text);
    --bs-alert-bg: var(--bs-secondary-bg-subtle);
    --bs-alert-border-color: var(--bs-secondary-border-subtle);
    --bs-alert-link-color: var(--bs-secondary-text);
}

.alert-light-primary {
    --bs-alert-color: var(--bs-light-primary-text);
    --bs-alert-bg: var(--bs-light-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-light-primary-border-subtle);
    --bs-alert-link-color: var(--bs-light-primary-text);
}

.alert-light-bg {
    --bs-alert-color: var(--bs-light-bg-text);
    --bs-alert-bg: var(--bs-light-bg-bg-subtle);
    --bs-alert-border-color: var(--bs-light-bg-border-subtle);
    --bs-alert-link-color: var(--bs-light-bg-text);
}

.alert-grey {
    --bs-alert-color: var(--bs-grey-text);
    --bs-alert-bg: var(--bs-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-grey-border-subtle);
    --bs-alert-link-color: var(--bs-grey-text);
}

.alert-purple {
    --bs-alert-color: var(--bs-purple-text);
    --bs-alert-bg: var(--bs-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-purple-border-subtle);
    --bs-alert-link-color: var(--bs-purple-text);
}

.alert-dark-purple {
    --bs-alert-color: var(--bs-dark-purple-text);
    --bs-alert-bg: var(--bs-dark-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-purple-border-subtle);
    --bs-alert-link-color: var(--bs-dark-purple-text);
}

.alert-violet {
    --bs-alert-color: var(--bs-violet-text);
    --bs-alert-bg: var(--bs-violet-bg-subtle);
    --bs-alert-border-color: var(--bs-violet-border-subtle);
    --bs-alert-link-color: var(--bs-violet-text);
}

.alert-dark-grey {
    --bs-alert-color: var(--bs-dark-grey-text);
    --bs-alert-bg: var(--bs-dark-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-grey-border-subtle);
    --bs-alert-link-color: var(--bs-dark-grey-text);
}

.alert-light-black {
    --bs-alert-color: var(--bs-light-black-text);
    --bs-alert-bg: var(--bs-light-black-bg-subtle);
    --bs-alert-border-color: var(--bs-light-black-border-subtle);
    --bs-alert-link-color: var(--bs-light-black-text);
}

.alert-border-color {
    --bs-alert-color: var(--bs-border-color-text);
    --bs-alert-bg: var(--bs-border-color-bg-subtle);
    --bs-alert-border-color: var(--bs-border-color-border-subtle);
    --bs-alert-link-color: var(--bs-border-color-text);
}

.alert-grey1 {
    --bs-alert-color: var(--bs-grey1-text);
    --bs-alert-bg: var(--bs-grey1-bg-subtle);
    --bs-alert-border-color: var(--bs-grey1-border-subtle);
    --bs-alert-link-color: var(--bs-grey1-text);
}

.alert-grey2 {
    --bs-alert-color: var(--bs-grey2-text);
    --bs-alert-bg: var(--bs-grey2-bg-subtle);
    --bs-alert-border-color: var(--bs-grey2-border-subtle);
    --bs-alert-link-color: var(--bs-grey2-text);
}

.alert-gray-color {
    --bs-alert-color: var(--bs-gray-color-text);
    --bs-alert-bg: var(--bs-gray-color-bg-subtle);
    --bs-alert-border-color: var(--bs-gray-color-border-subtle);
    --bs-alert-link-color: var(--bs-gray-color-text);
}

.alert-gray3 {
    --bs-alert-color: var(--bs-gray3-text);
    --bs-alert-bg: var(--bs-gray3-bg-subtle);
    --bs-alert-border-color: var(--bs-gray3-border-subtle);
    --bs-alert-link-color: var(--bs-gray3-text);
}

.alert-light-grey {
    --bs-alert-color: var(--bs-light-grey-text);
    --bs-alert-bg: var(--bs-light-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-light-grey-border-subtle);
    --bs-alert-link-color: var(--bs-light-grey-text);
}

.bg-primary {
    background: var(--primary) !important;
}

.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
    }

.btn-outline-primary {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary-accent);
}

    .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
        box-shadow: none;
        outline: none;
    }

.text-primary {
    color: var(--primary-accent) !important;
}

.bg-white {
    background: var(--surface) !important;
}

.btn-white {
    background: var(--surface);
    border-color: var(--on-primary);
}

    .btn-white:hover, .btn-white:focus, .btn-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
    }

.btn-outline-white {
    background: transparent;
    border-color: var(--on-primary);
    color: var(--on-primary);
}

    .btn-outline-white:hover, .btn-outline-white:focus, .btn-outline-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
        box-shadow: none;
        outline: none;
    }

.text-white {
    color: var(--on-primary) !important;
}

.bg-black {
    background: var(--black) !important;
}

.btn-black {
    background: var(--black);
    border-color: var(--black);
}

    .btn-black:hover, .btn-black:focus, .btn-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
    }

.btn-outline-black {
    background: transparent;
    border-color: var(--black);
    color: var(--text);
}

    .btn-outline-black:hover, .btn-outline-black:focus, .btn-outline-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
        box-shadow: none;
        outline: none;
    }

.text-black {
    color: var(--text) !important;
}

.bg-secondary {
    background: var(--text-muted) !important;
}

.btn-secondary {
    background: var(--text-muted);
    border-color: var(--text-muted);
}

    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
    }

.btn-outline-secondary {
    background: transparent;
    border-color: var(--text-muted);
    color: var(--text-muted);
}

    .btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
        box-shadow: none;
        outline: none;
    }

.text-secondary {
    color: var(--text-muted) !important;
}

.bg-light-primary {
    background: var(--light-primary) !important;
}

.btn-light-primary {
    background: var(--light-primary);
    border-color: var(--light-primary);
}

    .btn-light-primary:hover, .btn-light-primary:focus, .btn-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
    }

.btn-outline-light-primary {
    background: transparent;
    border-color: var(--light-primary);
    color: var(--light-primary);
}

    .btn-outline-light-primary:hover, .btn-outline-light-primary:focus, .btn-outline-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
        box-shadow: none;
        outline: none;
    }

.text-light-primary {
    color: var(--light-primary) !important;
}

.bg-light-bg {
    background: var(--light-bg) !important;
}

.btn-light-bg {
    background: var(--light-bg);
    border-color: var(--light-bg);
}

    .btn-light-bg:hover, .btn-light-bg:focus, .btn-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
    }

.btn-outline-light-bg {
    background: transparent;
    border-color: var(--light-bg);
    color: var(--light-bg);
}

    .btn-outline-light-bg:hover, .btn-outline-light-bg:focus, .btn-outline-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
        box-shadow: none;
        outline: none;
    }

.text-light-bg {
    color: var(--light-bg) !important;
}

.bg-grey {
    background: var(--grey) !important;
}

.btn-grey {
    background: var(--grey);
    border-color: var(--grey);
}

    .btn-grey:hover, .btn-grey:focus, .btn-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
    }

.btn-outline-grey {
    background: transparent;
    border-color: var(--grey);
    color: var(--grey);
}

    .btn-outline-grey:hover, .btn-outline-grey:focus, .btn-outline-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
        box-shadow: none;
        outline: none;
    }

.text-grey {
    color: var(--grey) !important;
}

.bg-purple {
    background: var(--purple) !important;
}

.btn-purple {
    background: var(--purple);
    border-color: var(--purple);
}

    .btn-purple:hover, .btn-purple:focus, .btn-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
    }

.btn-outline-purple {
    background: transparent;
    border-color: var(--purple);
    color: var(--purple);
}

    .btn-outline-purple:hover, .btn-outline-purple:focus, .btn-outline-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
        box-shadow: none;
        outline: none;
    }

.text-purple {
    color: var(--purple) !important;
}

.bg-dark-purple {
    background: var(--dark-purple) !important;
}

.btn-dark-purple {
    background: var(--dark-purple);
    border-color: var(--dark-purple);
}

    .btn-dark-purple:hover, .btn-dark-purple:focus, .btn-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
    }

.btn-outline-dark-purple {
    background: transparent;
    border-color: var(--dark-purple);
    color: var(--dark-purple);
}

    .btn-outline-dark-purple:hover, .btn-outline-dark-purple:focus, .btn-outline-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
        box-shadow: none;
        outline: none;
    }

.text-dark-purple {
    color: var(--dark-purple) !important;
}

.bg-violet {
    background: var(--violet) !important;
}

.btn-violet {
    background: var(--violet);
    border-color: var(--violet);
}

    .btn-violet:hover, .btn-violet:focus, .btn-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
    }

.btn-outline-violet {
    background: transparent;
    border-color: var(--violet);
    color: var(--primary-accent);
}

    .btn-outline-violet:hover, .btn-outline-violet:focus, .btn-outline-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
        box-shadow: none;
        outline: none;
    }

.text-violet {
    color: var(--primary-accent) !important;
}

.bg-dark-grey {
    background: var(--dark-grey) !important;
}

.btn-dark-grey {
    background: var(--dark-grey);
    border-color: var(--dark-grey);
}

    .btn-dark-grey:hover, .btn-dark-grey:focus, .btn-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
    }

.btn-outline-dark-grey {
    background: transparent;
    border-color: var(--dark-grey);
    color: var(--dark-grey);
}

    .btn-outline-dark-grey:hover, .btn-outline-dark-grey:focus, .btn-outline-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
        box-shadow: none;
        outline: none;
    }

.text-dark-grey {
    color: var(--dark-grey) !important;
}

.bg-light-black {
    background: var(--light-black) !important;
}

.btn-light-black {
    background: var(--light-black);
    border-color: var(--light-black);
}

    .btn-light-black:hover, .btn-light-black:focus, .btn-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
    }

.btn-outline-light-black {
    background: transparent;
    border-color: var(--light-black);
    color: var(--light-black);
}

    .btn-outline-light-black:hover, .btn-outline-light-black:focus, .btn-outline-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
        box-shadow: none;
        outline: none;
    }

.text-light-black {
    color: var(--light-black) !important;
}

.bg-border-color {
    background: var(--border-color) !important;
}

.btn-border-color {
    background: var(--border-color);
    border-color: var(--border-color);
}

    .btn-border-color:hover, .btn-border-color:focus, .btn-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
    }

.btn-outline-border-color {
    background: transparent;
    border-color: var(--border-color);
    color: var(--border-color);
}

    .btn-outline-border-color:hover, .btn-outline-border-color:focus, .btn-outline-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
        box-shadow: none;
        outline: none;
    }

.text-border-color {
    color: var(--border-color) !important;
}

.bg-grey1 {
    background: var(--grey1) !important;
}

.btn-grey1 {
    background: var(--grey1);
    border-color: var(--grey1);
}

    .btn-grey1:hover, .btn-grey1:focus, .btn-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
    }

.btn-outline-grey1 {
    background: transparent;
    border-color: var(--grey1);
    color: var(--grey1);
}

    .btn-outline-grey1:hover, .btn-outline-grey1:focus, .btn-outline-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
        box-shadow: none;
        outline: none;
    }

.text-grey1 {
    color: var(--grey1) !important;
}

.bg-grey2 {
    background: var(--grey2) !important;
}

.btn-grey2 {
    background: var(--grey2);
    border-color: var(--grey2);
}

    .btn-grey2:hover, .btn-grey2:focus, .btn-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
    }

.btn-outline-grey2 {
    background: transparent;
    border-color: var(--grey2);
    color: var(--grey2);
}

    .btn-outline-grey2:hover, .btn-outline-grey2:focus, .btn-outline-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
        box-shadow: none;
        outline: none;
    }

.text-grey2 {
    color: var(--grey2) !important;
}

.bg-gray-color {
    background: var(--gray-color) !important;
}

.btn-gray-color {
    background: var(--gray-color);
    border-color: var(--gray-color);
}

    .btn-gray-color:hover, .btn-gray-color:focus, .btn-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
    }

.btn-outline-gray-color {
    background: transparent;
    border-color: var(--gray-color);
    color: var(--gray-color);
}

    .btn-outline-gray-color:hover, .btn-outline-gray-color:focus, .btn-outline-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
        box-shadow: none;
        outline: none;
    }

.text-gray-color {
    color: var(--gray-color) !important;
}

.bg-gray3 {
    background: var(--gray3) !important;
}

.btn-gray3 {
    background: var(--gray3);
    border-color: var(--gray3);
}

    .btn-gray3:hover, .btn-gray3:focus, .btn-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
    }

.btn-outline-gray3 {
    background: transparent;
    border-color: var(--gray3);
    color: var(--gray3);
}

    .btn-outline-gray3:hover, .btn-outline-gray3:focus, .btn-outline-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
        box-shadow: none;
        outline: none;
    }

.text-gray3 {
    color: var(--gray3) !important;
}

.bg-light-grey {
    background: var(--light-grey) !important;
}

.btn-light-grey {
    background: var(--light-grey);
    border-color: var(--light-grey);
}

    .btn-light-grey:hover, .btn-light-grey:focus, .btn-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
    }

.btn-outline-light-grey {
    background: transparent;
    border-color: var(--light-grey);
    color: var(--light-grey);
}

    .btn-outline-light-grey:hover, .btn-outline-light-grey:focus, .btn-outline-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
        box-shadow: none;
        outline: none;
    }

.text-light-grey {
    color: var(--light-grey) !important;
}

.fs-56 {
    font-size: clamp(30px, 30px + 0vw, 30px);
}

@media (min-width: 768px) {
    .fs-56 {
        font-size: clamp(30px, 30px + 0vw, 30px);
    }
}

@media (min-width: 1200px) {
    .fs-56 {
        font-size: clamp(30px, -13.3333333333px + 3.6111111111vw, 56px);
    }
}

.fs-40 {
    font-size: clamp(18px, 13.7142857143px + 1.3392857143vw, 24px);
}

@media (min-width: 768px) {
    .fs-40 {
        font-size: clamp(24px, 24px + 0vw, 24px);
    }
}

@media (min-width: 1200px) {
    .fs-40 {
        font-size: clamp(24px, -2.6666666667px + 2.2222222222vw, 40px);
    }
}

.fs-38 {
    font-size: clamp(18px, 15.1428571429px + 0.8928571429vw, 22px);
}

@media (min-width: 768px) {
    .fs-38 {
        font-size: clamp(22px, 22px + 0vw, 22px);
    }
}

@media (min-width: 1200px) {
    .fs-38 {
        font-size: clamp(22px, -4.6666666667px + 2.2222222222vw, 38px);
    }
}

.fs-32 {
    font-size: clamp(18px, 16.5714285714px + 0.4464285714vw, 20px);
}

@media (min-width: 768px) {
    .fs-32 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .fs-32 {
        font-size: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.fs-28 {
    font-size: clamp(16px, 14.5714285714px + 0.4464285714vw, 18px);
}

@media (min-width: 768px) {
    .fs-28 {
        font-size: clamp(18px, 18px + 0vw, 18px);
    }
}

@media (min-width: 1200px) {
    .fs-28 {
        font-size: clamp(18px, 1.3333333333px + 1.3888888889vw, 28px);
    }
}

.fs-24 {
    font-size: clamp(16px, 16px + 0vw, 16px);
}

@media (min-width: 768px) {
    .fs-24 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-24 {
        font-size: clamp(16px, 2.6666666667px + 1.1111111111vw, 24px);
    }
}

.fs-22 {
    font-size: clamp(14px, 12.5714285714px + 0.4464285714vw, 16px);
}

@media (min-width: 768px) {
    .fs-22 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-22 {
        font-size: clamp(16px, 6px + 0.8333333333vw, 22px);
    }
}

.fs-20 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-20 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-20 {
        font-size: clamp(12px, -1.3333333333px + 1.1111111111vw, 20px);
    }
}

.fs-18 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-18 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-18 {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

.fs-16 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-16 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-16 {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

.fs-15 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-15 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-15 {
        font-size: clamp(12px, 7px + 0.4166666667vw, 15px);
    }
}

.fs-14 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-14 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-14 {
        font-size: clamp(10px, 3.3333333333px + 0.5555555556vw, 14px);
    }
}

.fs-12 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-12 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-12 {
        font-size: clamp(10px, 6.6666666667px + 0.2777777778vw, 12px);
    }
}

.section-title {
    text-align: start;
}

@media (max-width: 767.98px) {
    .section-title {
        margin-bottom: 24px !important;
    }
}

@media (max-width: 991.98px) {
    .section-title {
        padding-inline: 0 !important;
    }
}

.sub-title {
    text-transform: none;
    text-align: start;
    color: var(--text-muted);
}

.breadcrumb-menu {
    background-color: var(--surface-2);
    border: 1px solid var(--border-color);
    padding: 18px 0;
}

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
        content: var(--bs-breadcrumb-divider, ">");
        color: var(--purple);
        float: inline-start !important;
        padding-inline-end: var(--bs-breadcrumb-item-padding-x) !important;
    }

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item a {
        font-weight: 400;
        font-size: 16px;
        line-height: 19px;
        letter-spacing: -0.18px;
        color: var(--text-muted);
    }

        .breadcrumb-menu nav .breadcrumb .breadcrumb-item a.active {
            color: var(--purple);
        }

.registration-card {
    background: var(--registration-card-bg);
    border-radius: 16px;
    border: 1px solid var(--border);
    height: 100%;
    padding: 22px;
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .registration-card {
        padding: 14px;
    }
}

@media (max-width: 991.98px) {
    .registration-card {
        padding: 15px !important;
    }
}

.registration-card .steps-header {
    background: var(--surface-2);
    border-radius: 16px;
    display: flex;
    align-items: center;
    height: 130px;
    padding: 20px 24px;
    position: relative;
    overflow: hidden;
    border: 0 !important;
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .registration-card .steps-header {
        padding: 14px 16px;
    }
}

.registration-card .steps-header-icon {
    position: absolute;
    inset-inline-end: 0px;
    inset-block-end: 0px;
    width: 70px;
    height: auto;
    z-index: 1;
    object-fit: contain;
}

.registration-card .steps-header h5 {
    color: var(--text-muted);
    font-size: 32px;
    font-size: clamp(18px, 16.5714285714px + 0.4464285714vw, 20px);
}

@media (min-width: 768px) {
    .registration-card .steps-header h5 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .registration-card .steps-header h5 {
        font-size: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.registration-card .steps-header .small {
    font-size: 14px;
    font-size: clamp(10px, 10px + 0vw, 10px);
    color: var(--dark-grey);
}

@media (min-width: 768px) {
    .registration-card .steps-header .small {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .registration-card .steps-header .small {
        font-size: clamp(10px, 3.3333333333px + 0.5555555556vw, 14px);
    }
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .registration-card .steps-header .small {
        font-size: 12px !important;
    }
}

.registration-card .steps-body {
    padding: 24px 15px;
}

.registration-card .steps-timeline {
    position: relative;
    padding-inline-start: 40px;
}

    .registration-card .steps-timeline::before {
        content: "";
        position: absolute;
        inset-inline-start: 8px;
        height: 86%;
        inset-block: 0;
        border-inline-start: 2px dashed var(--border-color);
        /* default variant draws the connector per step (see .step-item::before);
           the .new-option variant re-enables this single line */
        display: none;
    }

@media (min-width: 1600px) and (max-width: 1920px) {
    .registration-card .steps-timeline::before {
        height: 87%;
    }
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .registration-card .steps-timeline::before {
        height: 87%;
        inset-inline-start: 5px;
    }
}

@media (max-width: 991.98px) {
    .registration-card .steps-timeline::before {
        inset-inline-start: 6px;
    }
}

.registration-card .step-item {
    position: relative;
    margin-bottom: 32px;
    border-block-end: 1px solid var(--border);
}

/* Per-step connector (default variant): drawn on every step except the last,
       so the dashed line always ends at the last step regardless of content height */
.registration-card:not(.new-option) .step-item:not(:last-child)::before {
    content: "";
    position: absolute;
    inset-inline-start: -32px;
    inset-block-start: 0;
    height: calc(100% + 32px);
    border-inline-start: 2px dashed var(--border-color);
}

.registration-card .step-item:last-child {
    padding-bottom: 0;
    border: none;
}

.registration-card .step-item:first-child {
    display: flex;
    align-items: center;
}

.registration-card .step-item:last-child {
    margin-bottom: 0;
}

    .registration-card .step-item:last-child .step-content {
        padding-bottom: 0;
        border: none;
    }

.registration-card .step-item .step-number {
    position: absolute;
    inset-inline-start: -55px;
    inset-block-start: -3px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: var(--surface-2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 500;
    color: var(--text);
    z-index: 1;
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .registration-card .step-item .step-number {
        width: 42px;
        height: 42px;
    }
}

@media (max-width: 767.98px) {
    .registration-card .step-item .step-number {
        width: 42px;
        height: 42px;
    }
}

.registration-card .step-item .step-content {
    margin-inline-start: 15px;
    padding-bottom: 30px;
}

@media (max-width: 991.98px) {
    .registration-card .step-item .step-content {
        padding-bottom: 20px;
    }
}

.registration-card .step-item .step-content p {
    font-size: 20px;
    font-size: clamp(12px, 10.5714285714px + 0.4464285714vw, 14px);
    color: var(--text-muted);
    line-height: 1.5;
    margin-bottom: 4px;
    font-weight: 500;
}

@media (min-width: 768px) {
    .registration-card .step-item .step-content p {
        font-size: clamp(14px, 14px + 0vw, 14px);
    }
}

@media (min-width: 1200px) {
    .registration-card .step-item .step-content p {
        font-size: clamp(14px, 4px + 0.8333333333vw, 20px);
    }
}

.registration-card .step-item .step-content p.discription {
    font-size: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .registration-card .step-item .step-content p.discription {
        font-size: 14px;
    }
}

@media (max-width: 991.98px) {
    .registration-card .step-item .step-content p.discription {
        font-size: 14px;
    }
}

.registration-card .step-item .step-content h6 {
    color: var(--purple);
    margin-bottom: 8px;
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .registration-card .step-item .step-content h6 {
        font-size: 16px !important;
    }
}

.registration-card .step-item .step-content a {
    color: var(--purple);
    text-decoration: underline;
    transition: color 0.3s ease;
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .registration-card .step-item .step-content a {
        font-size: 14px;
    }
}

@media (max-width: 991.98px) {
    .registration-card .step-item .step-content a {
        font-size: 14px;
    }
}

.registration-card .step-item .step-content a:hover {
    color: var(--primary-accent);
}

.registration-card.new-option {
    border: none;
    padding: 0;
}

@media (max-width: 991.98px) {
    .registration-card.new-option {
        padding: 0 !important;
    }
}

.registration-card.new-option .steps-header {
    background: transparent;
    padding: 20px 0;
    border-radius: 0;
}

@media (max-width: 991.98px) {
    .registration-card.new-option .steps-header {
        padding: 15px 0;
    }
}

.registration-card.new-option .step-item:first-child {
    display: block;
}

.registration-card.new-option .step-number {
    background-color: var(--surface);
    width: 24px;
    height: 24px;
    border: 3px solid var(--border-color);
    inset-inline-start: -43px;
    inset-block-start: 0px;
}

@media (max-width: 991.98px) {
    .registration-card.new-option .step-number {
        inset-inline-start: -45px;
    }
}

.registration-card.new-option .steps-timeline::before {
    height: 86.5%;
    display: block;
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .registration-card.new-option .steps-timeline::before {
        height: 87.8%;
        inset-inline-start: 8px;
    }
}

/* timelineBox read more / read less */
.registration-card .step-rm-body {
    display: block;
    overflow: hidden;
}

    .registration-card .step-rm-body.step-rm-collapsed {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

.registration-card .step-rm-more,
.registration-card .step-rm-less {
    display: inline-block;
    margin-top: 4px;
    color: var(--primary-accent);
    text-decoration: underline;
    cursor: pointer;
}

.row.custom-row {
    --bs-gutter-y: 15px;
}

/*!
* Style Sheet for ""
* version: 1
* last modified:2023 By Applab
* author: Applab
* website: www.applab.qa
*/
.alert-primary {
    --bs-alert-color: var(--bs-primary-text);
    --bs-alert-bg: var(--bs-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-primary-border-subtle);
    --bs-alert-link-color: var(--bs-primary-text);
}

.alert-white {
    --bs-alert-color: var(--bs-white-text);
    --bs-alert-bg: var(--bs-white-bg-subtle);
    --bs-alert-border-color: var(--bs-white-border-subtle);
    --bs-alert-link-color: var(--bs-white-text);
}

.alert-black {
    --bs-alert-color: var(--bs-black-text);
    --bs-alert-bg: var(--bs-black-bg-subtle);
    --bs-alert-border-color: var(--bs-black-border-subtle);
    --bs-alert-link-color: var(--bs-black-text);
}

.alert-secondary {
    --bs-alert-color: var(--bs-secondary-text);
    --bs-alert-bg: var(--bs-secondary-bg-subtle);
    --bs-alert-border-color: var(--bs-secondary-border-subtle);
    --bs-alert-link-color: var(--bs-secondary-text);
}

.alert-light-primary {
    --bs-alert-color: var(--bs-light-primary-text);
    --bs-alert-bg: var(--bs-light-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-light-primary-border-subtle);
    --bs-alert-link-color: var(--bs-light-primary-text);
}

.alert-light-bg {
    --bs-alert-color: var(--bs-light-bg-text);
    --bs-alert-bg: var(--bs-light-bg-bg-subtle);
    --bs-alert-border-color: var(--bs-light-bg-border-subtle);
    --bs-alert-link-color: var(--bs-light-bg-text);
}

.alert-grey {
    --bs-alert-color: var(--bs-grey-text);
    --bs-alert-bg: var(--bs-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-grey-border-subtle);
    --bs-alert-link-color: var(--bs-grey-text);
}

.alert-purple {
    --bs-alert-color: var(--bs-purple-text);
    --bs-alert-bg: var(--bs-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-purple-border-subtle);
    --bs-alert-link-color: var(--bs-purple-text);
}

.alert-dark-purple {
    --bs-alert-color: var(--bs-dark-purple-text);
    --bs-alert-bg: var(--bs-dark-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-purple-border-subtle);
    --bs-alert-link-color: var(--bs-dark-purple-text);
}

.alert-violet {
    --bs-alert-color: var(--bs-violet-text);
    --bs-alert-bg: var(--bs-violet-bg-subtle);
    --bs-alert-border-color: var(--bs-violet-border-subtle);
    --bs-alert-link-color: var(--bs-violet-text);
}

.alert-dark-grey {
    --bs-alert-color: var(--bs-dark-grey-text);
    --bs-alert-bg: var(--bs-dark-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-grey-border-subtle);
    --bs-alert-link-color: var(--bs-dark-grey-text);
}

.alert-light-black {
    --bs-alert-color: var(--bs-light-black-text);
    --bs-alert-bg: var(--bs-light-black-bg-subtle);
    --bs-alert-border-color: var(--bs-light-black-border-subtle);
    --bs-alert-link-color: var(--bs-light-black-text);
}

.alert-border-color {
    --bs-alert-color: var(--bs-border-color-text);
    --bs-alert-bg: var(--bs-border-color-bg-subtle);
    --bs-alert-border-color: var(--bs-border-color-border-subtle);
    --bs-alert-link-color: var(--bs-border-color-text);
}

.alert-grey1 {
    --bs-alert-color: var(--bs-grey1-text);
    --bs-alert-bg: var(--bs-grey1-bg-subtle);
    --bs-alert-border-color: var(--bs-grey1-border-subtle);
    --bs-alert-link-color: var(--bs-grey1-text);
}

.alert-grey2 {
    --bs-alert-color: var(--bs-grey2-text);
    --bs-alert-bg: var(--bs-grey2-bg-subtle);
    --bs-alert-border-color: var(--bs-grey2-border-subtle);
    --bs-alert-link-color: var(--bs-grey2-text);
}

.alert-gray-color {
    --bs-alert-color: var(--bs-gray-color-text);
    --bs-alert-bg: var(--bs-gray-color-bg-subtle);
    --bs-alert-border-color: var(--bs-gray-color-border-subtle);
    --bs-alert-link-color: var(--bs-gray-color-text);
}

.alert-gray3 {
    --bs-alert-color: var(--bs-gray3-text);
    --bs-alert-bg: var(--bs-gray3-bg-subtle);
    --bs-alert-border-color: var(--bs-gray3-border-subtle);
    --bs-alert-link-color: var(--bs-gray3-text);
}

.alert-light-grey {
    --bs-alert-color: var(--bs-light-grey-text);
    --bs-alert-bg: var(--bs-light-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-light-grey-border-subtle);
    --bs-alert-link-color: var(--bs-light-grey-text);
}

.bg-primary {
    background: var(--primary) !important;
}

.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
    }

.btn-outline-primary {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary-accent);
}

    .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
        box-shadow: none;
        outline: none;
    }

.text-primary {
    color: var(--primary-accent) !important;
}

.bg-white {
    background: var(--surface) !important;
}

.btn-white {
    background: var(--surface);
    border-color: var(--on-primary);
}

    .btn-white:hover, .btn-white:focus, .btn-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
    }

.btn-outline-white {
    background: transparent;
    border-color: var(--on-primary);
    color: var(--on-primary);
}

    .btn-outline-white:hover, .btn-outline-white:focus, .btn-outline-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
        box-shadow: none;
        outline: none;
    }

.text-white {
    color: var(--on-primary) !important;
}

.bg-black {
    background: var(--black) !important;
}

.btn-black {
    background: var(--black);
    border-color: var(--black);
}

    .btn-black:hover, .btn-black:focus, .btn-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
    }

.btn-outline-black {
    background: transparent;
    border-color: var(--black);
    color: var(--text);
}

    .btn-outline-black:hover, .btn-outline-black:focus, .btn-outline-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
        box-shadow: none;
        outline: none;
    }

.text-black {
    color: var(--text) !important;
}

.bg-secondary {
    background: var(--text-muted) !important;
}

.btn-secondary {
    background: var(--text-muted);
    border-color: var(--text-muted);
}

    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
    }

.btn-outline-secondary {
    background: transparent;
    border-color: var(--text-muted);
    color: var(--text-muted);
}

    .btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
        box-shadow: none;
        outline: none;
    }

.text-secondary {
    color: var(--text-muted) !important;
}

.bg-light-primary {
    background: var(--light-primary) !important;
}

.btn-light-primary {
    background: var(--light-primary);
    border-color: var(--light-primary);
}

    .btn-light-primary:hover, .btn-light-primary:focus, .btn-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
    }

.btn-outline-light-primary {
    background: transparent;
    border-color: var(--light-primary);
    color: var(--light-primary);
}

    .btn-outline-light-primary:hover, .btn-outline-light-primary:focus, .btn-outline-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
        box-shadow: none;
        outline: none;
    }

.text-light-primary {
    color: var(--light-primary) !important;
}

.bg-light-bg {
    background: var(--light-bg) !important;
}

.btn-light-bg {
    background: var(--light-bg);
    border-color: var(--light-bg);
}

    .btn-light-bg:hover, .btn-light-bg:focus, .btn-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
    }

.btn-outline-light-bg {
    background: transparent;
    border-color: var(--light-bg);
    color: var(--light-bg);
}

    .btn-outline-light-bg:hover, .btn-outline-light-bg:focus, .btn-outline-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
        box-shadow: none;
        outline: none;
    }

.text-light-bg {
    color: var(--light-bg) !important;
}

.bg-grey {
    background: var(--grey) !important;
}

.btn-grey {
    background: var(--grey);
    border-color: var(--grey);
}

    .btn-grey:hover, .btn-grey:focus, .btn-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
    }

.btn-outline-grey {
    background: transparent;
    border-color: var(--grey);
    color: var(--grey);
}

    .btn-outline-grey:hover, .btn-outline-grey:focus, .btn-outline-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
        box-shadow: none;
        outline: none;
    }

.text-grey {
    color: var(--grey) !important;
}

.bg-purple {
    background: var(--purple) !important;
}

.btn-purple {
    background: var(--purple);
    border-color: var(--purple);
}

    .btn-purple:hover, .btn-purple:focus, .btn-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
    }

.btn-outline-purple {
    background: transparent;
    border-color: var(--purple);
    color: var(--purple);
}

    .btn-outline-purple:hover, .btn-outline-purple:focus, .btn-outline-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
        box-shadow: none;
        outline: none;
    }

.text-purple {
    color: var(--purple) !important;
}

.bg-dark-purple {
    background: var(--dark-purple) !important;
}

.btn-dark-purple {
    background: var(--dark-purple);
    border-color: var(--dark-purple);
}

    .btn-dark-purple:hover, .btn-dark-purple:focus, .btn-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
    }

.btn-outline-dark-purple {
    background: transparent;
    border-color: var(--dark-purple);
    color: var(--dark-purple);
}

    .btn-outline-dark-purple:hover, .btn-outline-dark-purple:focus, .btn-outline-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
        box-shadow: none;
        outline: none;
    }

.text-dark-purple {
    color: var(--dark-purple) !important;
}

.bg-violet {
    background: var(--violet) !important;
}

.btn-violet {
    background: var(--violet);
    border-color: var(--violet);
}

    .btn-violet:hover, .btn-violet:focus, .btn-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
    }

.btn-outline-violet {
    background: transparent;
    border-color: var(--violet);
    color: var(--primary-accent);
}

    .btn-outline-violet:hover, .btn-outline-violet:focus, .btn-outline-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
        box-shadow: none;
        outline: none;
    }

.text-violet {
    color: var(--primary-accent) !important;
}

.bg-dark-grey {
    background: var(--dark-grey) !important;
}

.btn-dark-grey {
    background: var(--dark-grey);
    border-color: var(--dark-grey);
}

    .btn-dark-grey:hover, .btn-dark-grey:focus, .btn-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
    }

.btn-outline-dark-grey {
    background: transparent;
    border-color: var(--dark-grey);
    color: var(--dark-grey);
}

    .btn-outline-dark-grey:hover, .btn-outline-dark-grey:focus, .btn-outline-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
        box-shadow: none;
        outline: none;
    }

.text-dark-grey {
    color: var(--dark-grey) !important;
}

.bg-light-black {
    background: var(--light-black) !important;
}

.btn-light-black {
    background: var(--light-black);
    border-color: var(--light-black);
}

    .btn-light-black:hover, .btn-light-black:focus, .btn-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
    }

.btn-outline-light-black {
    background: transparent;
    border-color: var(--light-black);
    color: var(--light-black);
}

    .btn-outline-light-black:hover, .btn-outline-light-black:focus, .btn-outline-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
        box-shadow: none;
        outline: none;
    }

.text-light-black {
    color: var(--light-black) !important;
}

.bg-border-color {
    background: var(--border-color) !important;
}

.btn-border-color {
    background: var(--border-color);
    border-color: var(--border-color);
}

    .btn-border-color:hover, .btn-border-color:focus, .btn-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
    }

.btn-outline-border-color {
    background: transparent;
    border-color: var(--border-color);
    color: var(--border-color);
}

    .btn-outline-border-color:hover, .btn-outline-border-color:focus, .btn-outline-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
        box-shadow: none;
        outline: none;
    }

.text-border-color {
    color: var(--border-color) !important;
}

.bg-grey1 {
    background: var(--grey1) !important;
}

.btn-grey1 {
    background: var(--grey1);
    border-color: var(--grey1);
}

    .btn-grey1:hover, .btn-grey1:focus, .btn-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
    }

.btn-outline-grey1 {
    background: transparent;
    border-color: var(--grey1);
    color: var(--grey1);
}

    .btn-outline-grey1:hover, .btn-outline-grey1:focus, .btn-outline-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
        box-shadow: none;
        outline: none;
    }

.text-grey1 {
    color: var(--grey1) !important;
}

.bg-grey2 {
    background: var(--grey2) !important;
}

.btn-grey2 {
    background: var(--grey2);
    border-color: var(--grey2);
}

    .btn-grey2:hover, .btn-grey2:focus, .btn-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
    }

.btn-outline-grey2 {
    background: transparent;
    border-color: var(--grey2);
    color: var(--grey2);
}

    .btn-outline-grey2:hover, .btn-outline-grey2:focus, .btn-outline-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
        box-shadow: none;
        outline: none;
    }

.text-grey2 {
    color: var(--grey2) !important;
}

.bg-gray-color {
    background: var(--gray-color) !important;
}

.btn-gray-color {
    background: var(--gray-color);
    border-color: var(--gray-color);
}

    .btn-gray-color:hover, .btn-gray-color:focus, .btn-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
    }

.btn-outline-gray-color {
    background: transparent;
    border-color: var(--gray-color);
    color: var(--gray-color);
}

    .btn-outline-gray-color:hover, .btn-outline-gray-color:focus, .btn-outline-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
        box-shadow: none;
        outline: none;
    }

.text-gray-color {
    color: var(--gray-color) !important;
}

.bg-gray3 {
    background: var(--gray3) !important;
}

.btn-gray3 {
    background: var(--gray3);
    border-color: var(--gray3);
}

    .btn-gray3:hover, .btn-gray3:focus, .btn-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
    }

.btn-outline-gray3 {
    background: transparent;
    border-color: var(--gray3);
    color: var(--gray3);
}

    .btn-outline-gray3:hover, .btn-outline-gray3:focus, .btn-outline-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
        box-shadow: none;
        outline: none;
    }

.text-gray3 {
    color: var(--gray3) !important;
}

.bg-light-grey {
    background: var(--light-grey) !important;
}

.btn-light-grey {
    background: var(--light-grey);
    border-color: var(--light-grey);
}

    .btn-light-grey:hover, .btn-light-grey:focus, .btn-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
    }

.btn-outline-light-grey {
    background: transparent;
    border-color: var(--light-grey);
    color: var(--light-grey);
}

    .btn-outline-light-grey:hover, .btn-outline-light-grey:focus, .btn-outline-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
        box-shadow: none;
        outline: none;
    }

.text-light-grey {
    color: var(--light-grey) !important;
}

.fs-56 {
    font-size: clamp(30px, 30px + 0vw, 30px);
}

@media (min-width: 768px) {
    .fs-56 {
        font-size: clamp(30px, 30px + 0vw, 30px);
    }
}

@media (min-width: 1200px) {
    .fs-56 {
        font-size: clamp(30px, -13.3333333333px + 3.6111111111vw, 56px);
    }
}

.fs-40 {
    font-size: clamp(18px, 13.7142857143px + 1.3392857143vw, 24px);
}

@media (min-width: 768px) {
    .fs-40 {
        font-size: clamp(24px, 24px + 0vw, 24px);
    }
}

@media (min-width: 1200px) {
    .fs-40 {
        font-size: clamp(24px, -2.6666666667px + 2.2222222222vw, 40px);
    }
}

.fs-38 {
    font-size: clamp(18px, 15.1428571429px + 0.8928571429vw, 22px);
}

@media (min-width: 768px) {
    .fs-38 {
        font-size: clamp(22px, 22px + 0vw, 22px);
    }
}

@media (min-width: 1200px) {
    .fs-38 {
        font-size: clamp(22px, -4.6666666667px + 2.2222222222vw, 38px);
    }
}

.fs-32 {
    font-size: clamp(18px, 16.5714285714px + 0.4464285714vw, 20px);
}

@media (min-width: 768px) {
    .fs-32 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .fs-32 {
        font-size: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.fs-28 {
    font-size: clamp(16px, 14.5714285714px + 0.4464285714vw, 18px);
}

@media (min-width: 768px) {
    .fs-28 {
        font-size: clamp(18px, 18px + 0vw, 18px);
    }
}

@media (min-width: 1200px) {
    .fs-28 {
        font-size: clamp(18px, 1.3333333333px + 1.3888888889vw, 28px);
    }
}

.fs-24 {
    font-size: clamp(16px, 16px + 0vw, 16px);
}

@media (min-width: 768px) {
    .fs-24 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-24 {
        font-size: clamp(16px, 2.6666666667px + 1.1111111111vw, 24px);
    }
}

.fs-22 {
    font-size: clamp(14px, 12.5714285714px + 0.4464285714vw, 16px);
}

@media (min-width: 768px) {
    .fs-22 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-22 {
        font-size: clamp(16px, 6px + 0.8333333333vw, 22px);
    }
}

.fs-20 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-20 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-20 {
        font-size: clamp(12px, -1.3333333333px + 1.1111111111vw, 20px);
    }
}

.fs-18 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-18 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-18 {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

.fs-16 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-16 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-16 {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

.fs-15 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-15 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-15 {
        font-size: clamp(12px, 7px + 0.4166666667vw, 15px);
    }
}

.fs-14 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-14 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-14 {
        font-size: clamp(10px, 3.3333333333px + 0.5555555556vw, 14px);
    }
}

.fs-12 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-12 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-12 {
        font-size: clamp(10px, 6.6666666667px + 0.2777777778vw, 12px);
    }
}

.section-title {
    text-align: start;
}

@media (max-width: 767.98px) {
    .section-title {
        margin-bottom: 24px !important;
    }
}

@media (max-width: 991.98px) {
    .section-title {
        padding-inline: 0 !important;
    }
}

.sub-title {
    text-transform: none;
    text-align: start;
    color: var(--text-muted);
}

.breadcrumb-menu {
    background-color: var(--surface-2);
    border: 1px solid var(--border-color);
    padding: 18px 0;
}

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
        content: var(--bs-breadcrumb-divider, ">");
        color: var(--purple);
        float: inline-start !important;
        padding-inline-end: var(--bs-breadcrumb-item-padding-x) !important;
    }

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item a {
        font-weight: 400;
        font-size: 16px;
        line-height: 19px;
        letter-spacing: -0.18px;
        color: var(--text-muted);
    }

        .breadcrumb-menu nav .breadcrumb .breadcrumb-item a.active {
            color: var(--purple);
        }

.map-container {
    position: relative;
    width: 100%;
    height: 600px;
    overflow: hidden;
    border-radius: 8px;
}

.map-container__iframe {
    width: 100%;
    height: 100%;
    border: 0;
}

.map-container__map {
    width: 100%;
    height: 100%;
    border: 0;
}

.map-marker {
    position: absolute;
    top: 73%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    pointer-events: none;
    max-width: 430px;
}

.map-marker__card {
    background-color: var(--surface);
    border-radius: 12px;
    border: 1px solid var(--border);
    padding: 24px;
    max-width: 100%;
    pointer-events: auto;
    height: 100%;
}

.map-marker__title {
    font-weight: 600;
    color: var(--purple);
    margin-bottom: 16px;
    line-height: 1.2;
}

.map-marker__address {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 20px;
}

.map-marker__icon {
    color: var(--text);
    font-size: 16px;
    margin-top: 2px;
    flex-shrink: 0;
}

.map-marker__text {
    font-size: 16px;
    font-weight: 400;
    color: var(--text-muted);
    line-height: 1.5;
}

.map-marker__button {
    width: max-content;
    padding: 12px 24px;
    background-color: transparent;
    border: 1px solid var(--purple);
    border-radius: 24px;
    color: var(--purple);
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .map-marker__button:hover {
        background-color: var(--purple);
        color: var(--on-primary);
    }

    .map-marker__button:focus {
        outline: none;
        box-shadow: 0 0 0 3px rgba(96, 63, 131, 0.25);
    }

.contact-card__wrapper {
    padding-block: 24px;
    border-bottom: 1px solid var(--border-color);
}

.contact-card__name {
    margin-bottom: 16px;
    line-height: 1.2;
}

.contact-card__phone, .contact-card__email {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
}

.contact-card__item {
    display: flex;
    align-items: center;
    gap: 8px;
}

.contact-card__icon {
    font-size: 16px;
    flex-shrink: 0;
}

.contact-card__text {
    line-height: 1.5;
    color: var(--text-muted);
}

@media (max-width: 767.98px) {
    .map-marker__card {
        min-width: 280px;
        max-width: 100%;
        padding: 20px;
    }

    .map-marker__title {
        font-size: 24px;
        margin-bottom: 12px;
    }

    .map-marker__text {
        font-size: 14px;
    }

    .map-marker__button {
        padding: 10px 20px;
        font-size: 14px;
    }
}

.title-offcanvas {
    text-align: start;
}

/*!
* Style Sheet for ""
* version: 1
* last modified:2023 By Applab
* author: Applab
* website: www.applab.qa
*/
.alert-primary {
    --bs-alert-color: var(--bs-primary-text);
    --bs-alert-bg: var(--bs-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-primary-border-subtle);
    --bs-alert-link-color: var(--bs-primary-text);
}

.alert-white {
    --bs-alert-color: var(--bs-white-text);
    --bs-alert-bg: var(--bs-white-bg-subtle);
    --bs-alert-border-color: var(--bs-white-border-subtle);
    --bs-alert-link-color: var(--bs-white-text);
}

.alert-black {
    --bs-alert-color: var(--bs-black-text);
    --bs-alert-bg: var(--bs-black-bg-subtle);
    --bs-alert-border-color: var(--bs-black-border-subtle);
    --bs-alert-link-color: var(--bs-black-text);
}

.alert-secondary {
    --bs-alert-color: var(--bs-secondary-text);
    --bs-alert-bg: var(--bs-secondary-bg-subtle);
    --bs-alert-border-color: var(--bs-secondary-border-subtle);
    --bs-alert-link-color: var(--bs-secondary-text);
}

.alert-light-primary {
    --bs-alert-color: var(--bs-light-primary-text);
    --bs-alert-bg: var(--bs-light-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-light-primary-border-subtle);
    --bs-alert-link-color: var(--bs-light-primary-text);
}

.alert-light-bg {
    --bs-alert-color: var(--bs-light-bg-text);
    --bs-alert-bg: var(--bs-light-bg-bg-subtle);
    --bs-alert-border-color: var(--bs-light-bg-border-subtle);
    --bs-alert-link-color: var(--bs-light-bg-text);
}

.alert-grey {
    --bs-alert-color: var(--bs-grey-text);
    --bs-alert-bg: var(--bs-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-grey-border-subtle);
    --bs-alert-link-color: var(--bs-grey-text);
}

.alert-purple {
    --bs-alert-color: var(--bs-purple-text);
    --bs-alert-bg: var(--bs-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-purple-border-subtle);
    --bs-alert-link-color: var(--bs-purple-text);
}

.alert-dark-purple {
    --bs-alert-color: var(--bs-dark-purple-text);
    --bs-alert-bg: var(--bs-dark-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-purple-border-subtle);
    --bs-alert-link-color: var(--bs-dark-purple-text);
}

.alert-violet {
    --bs-alert-color: var(--bs-violet-text);
    --bs-alert-bg: var(--bs-violet-bg-subtle);
    --bs-alert-border-color: var(--bs-violet-border-subtle);
    --bs-alert-link-color: var(--bs-violet-text);
}

.alert-dark-grey {
    --bs-alert-color: var(--bs-dark-grey-text);
    --bs-alert-bg: var(--bs-dark-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-grey-border-subtle);
    --bs-alert-link-color: var(--bs-dark-grey-text);
}

.alert-light-black {
    --bs-alert-color: var(--bs-light-black-text);
    --bs-alert-bg: var(--bs-light-black-bg-subtle);
    --bs-alert-border-color: var(--bs-light-black-border-subtle);
    --bs-alert-link-color: var(--bs-light-black-text);
}

.alert-border-color {
    --bs-alert-color: var(--bs-border-color-text);
    --bs-alert-bg: var(--bs-border-color-bg-subtle);
    --bs-alert-border-color: var(--bs-border-color-border-subtle);
    --bs-alert-link-color: var(--bs-border-color-text);
}

.alert-grey1 {
    --bs-alert-color: var(--bs-grey1-text);
    --bs-alert-bg: var(--bs-grey1-bg-subtle);
    --bs-alert-border-color: var(--bs-grey1-border-subtle);
    --bs-alert-link-color: var(--bs-grey1-text);
}

.alert-grey2 {
    --bs-alert-color: var(--bs-grey2-text);
    --bs-alert-bg: var(--bs-grey2-bg-subtle);
    --bs-alert-border-color: var(--bs-grey2-border-subtle);
    --bs-alert-link-color: var(--bs-grey2-text);
}

.alert-gray-color {
    --bs-alert-color: var(--bs-gray-color-text);
    --bs-alert-bg: var(--bs-gray-color-bg-subtle);
    --bs-alert-border-color: var(--bs-gray-color-border-subtle);
    --bs-alert-link-color: var(--bs-gray-color-text);
}

.alert-gray3 {
    --bs-alert-color: var(--bs-gray3-text);
    --bs-alert-bg: var(--bs-gray3-bg-subtle);
    --bs-alert-border-color: var(--bs-gray3-border-subtle);
    --bs-alert-link-color: var(--bs-gray3-text);
}

.alert-light-grey {
    --bs-alert-color: var(--bs-light-grey-text);
    --bs-alert-bg: var(--bs-light-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-light-grey-border-subtle);
    --bs-alert-link-color: var(--bs-light-grey-text);
}

.bg-primary {
    background: var(--primary) !important;
}

.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
    }

.btn-outline-primary {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary-accent);
}

    .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
        box-shadow: none;
        outline: none;
    }

.text-primary {
    color: var(--primary-accent) !important;
}

.bg-white {
    background: var(--surface) !important;
}

.btn-white {
    background: var(--surface);
    border-color: var(--on-primary);
}

    .btn-white:hover, .btn-white:focus, .btn-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
    }

.btn-outline-white {
    background: transparent;
    border-color: var(--on-primary);
    color: var(--on-primary);
}

    .btn-outline-white:hover, .btn-outline-white:focus, .btn-outline-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
        box-shadow: none;
        outline: none;
    }

.text-white {
    color: var(--on-primary) !important;
}

.bg-black {
    background: var(--black) !important;
}

.btn-black {
    background: var(--black);
    border-color: var(--black);
}

    .btn-black:hover, .btn-black:focus, .btn-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
    }

.btn-outline-black {
    background: transparent;
    border-color: var(--black);
    color: var(--text);
}

    .btn-outline-black:hover, .btn-outline-black:focus, .btn-outline-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
        box-shadow: none;
        outline: none;
    }

.text-black {
    color: var(--text) !important;
}

.bg-secondary {
    background: var(--text-muted) !important;
}

.btn-secondary {
    background: var(--text-muted);
    border-color: var(--text-muted);
}

    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
    }

.btn-outline-secondary {
    background: transparent;
    border-color: var(--text-muted);
    color: var(--text-muted);
}

    .btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
        box-shadow: none;
        outline: none;
    }

.text-secondary {
    color: var(--text-muted) !important;
}

.bg-light-primary {
    background: var(--light-primary) !important;
}

.btn-light-primary {
    background: var(--light-primary);
    border-color: var(--light-primary);
}

    .btn-light-primary:hover, .btn-light-primary:focus, .btn-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
    }

.btn-outline-light-primary {
    background: transparent;
    border-color: var(--light-primary);
    color: var(--light-primary);
}

    .btn-outline-light-primary:hover, .btn-outline-light-primary:focus, .btn-outline-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
        box-shadow: none;
        outline: none;
    }

.text-light-primary {
    color: var(--light-primary) !important;
}

.bg-light-bg {
    background: var(--light-bg) !important;
}

.btn-light-bg {
    background: var(--light-bg);
    border-color: var(--light-bg);
}

    .btn-light-bg:hover, .btn-light-bg:focus, .btn-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
    }

.btn-outline-light-bg {
    background: transparent;
    border-color: var(--light-bg);
    color: var(--light-bg);
}

    .btn-outline-light-bg:hover, .btn-outline-light-bg:focus, .btn-outline-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
        box-shadow: none;
        outline: none;
    }

.text-light-bg {
    color: var(--light-bg) !important;
}

.bg-grey {
    background: var(--grey) !important;
}

.btn-grey {
    background: var(--grey);
    border-color: var(--grey);
}

    .btn-grey:hover, .btn-grey:focus, .btn-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
    }

.btn-outline-grey {
    background: transparent;
    border-color: var(--grey);
    color: var(--grey);
}

    .btn-outline-grey:hover, .btn-outline-grey:focus, .btn-outline-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
        box-shadow: none;
        outline: none;
    }

.text-grey {
    color: var(--grey) !important;
}

.bg-purple {
    background: var(--purple) !important;
}

.btn-purple {
    background: var(--purple);
    border-color: var(--purple);
}

    .btn-purple:hover, .btn-purple:focus, .btn-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
    }

.btn-outline-purple {
    background: transparent;
    border-color: var(--purple);
    color: var(--purple);
}

    .btn-outline-purple:hover, .btn-outline-purple:focus, .btn-outline-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
        box-shadow: none;
        outline: none;
    }

.text-purple {
    color: var(--purple) !important;
}

.bg-dark-purple {
    background: var(--dark-purple) !important;
}

.btn-dark-purple {
    background: var(--dark-purple);
    border-color: var(--dark-purple);
}

    .btn-dark-purple:hover, .btn-dark-purple:focus, .btn-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
    }

.btn-outline-dark-purple {
    background: transparent;
    border-color: var(--dark-purple);
    color: var(--dark-purple);
}

    .btn-outline-dark-purple:hover, .btn-outline-dark-purple:focus, .btn-outline-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
        box-shadow: none;
        outline: none;
    }

.text-dark-purple {
    color: var(--dark-purple) !important;
}

.bg-violet {
    background: var(--violet) !important;
}

.btn-violet {
    background: var(--violet);
    border-color: var(--violet);
}

    .btn-violet:hover, .btn-violet:focus, .btn-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
    }

.btn-outline-violet {
    background: transparent;
    border-color: var(--violet);
    color: var(--primary-accent);
}

    .btn-outline-violet:hover, .btn-outline-violet:focus, .btn-outline-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
        box-shadow: none;
        outline: none;
    }

.text-violet {
    color: var(--primary-accent) !important;
}

.bg-dark-grey {
    background: var(--dark-grey) !important;
}

.btn-dark-grey {
    background: var(--dark-grey);
    border-color: var(--dark-grey);
}

    .btn-dark-grey:hover, .btn-dark-grey:focus, .btn-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
    }

.btn-outline-dark-grey {
    background: transparent;
    border-color: var(--dark-grey);
    color: var(--dark-grey);
}

    .btn-outline-dark-grey:hover, .btn-outline-dark-grey:focus, .btn-outline-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
        box-shadow: none;
        outline: none;
    }

.text-dark-grey {
    color: var(--dark-grey) !important;
}

.bg-light-black {
    background: var(--light-black) !important;
}

.btn-light-black {
    background: var(--light-black);
    border-color: var(--light-black);
}

    .btn-light-black:hover, .btn-light-black:focus, .btn-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
    }

.btn-outline-light-black {
    background: transparent;
    border-color: var(--light-black);
    color: var(--light-black);
}

    .btn-outline-light-black:hover, .btn-outline-light-black:focus, .btn-outline-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
        box-shadow: none;
        outline: none;
    }

.text-light-black {
    color: var(--light-black) !important;
}

.bg-border-color {
    background: var(--border-color) !important;
}

.btn-border-color {
    background: var(--border-color);
    border-color: var(--border-color);
}

    .btn-border-color:hover, .btn-border-color:focus, .btn-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
    }

.btn-outline-border-color {
    background: transparent;
    border-color: var(--border-color);
    color: var(--border-color);
}

    .btn-outline-border-color:hover, .btn-outline-border-color:focus, .btn-outline-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
        box-shadow: none;
        outline: none;
    }

.text-border-color {
    color: var(--border-color) !important;
}

.bg-grey1 {
    background: var(--grey1) !important;
}

.btn-grey1 {
    background: var(--grey1);
    border-color: var(--grey1);
}

    .btn-grey1:hover, .btn-grey1:focus, .btn-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
    }

.btn-outline-grey1 {
    background: transparent;
    border-color: var(--grey1);
    color: var(--grey1);
}

    .btn-outline-grey1:hover, .btn-outline-grey1:focus, .btn-outline-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
        box-shadow: none;
        outline: none;
    }

.text-grey1 {
    color: var(--grey1) !important;
}

.bg-grey2 {
    background: var(--grey2) !important;
}

.btn-grey2 {
    background: var(--grey2);
    border-color: var(--grey2);
}

    .btn-grey2:hover, .btn-grey2:focus, .btn-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
    }

.btn-outline-grey2 {
    background: transparent;
    border-color: var(--grey2);
    color: var(--grey2);
}

    .btn-outline-grey2:hover, .btn-outline-grey2:focus, .btn-outline-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
        box-shadow: none;
        outline: none;
    }

.text-grey2 {
    color: var(--grey2) !important;
}

.bg-gray-color {
    background: var(--gray-color) !important;
}

.btn-gray-color {
    background: var(--gray-color);
    border-color: var(--gray-color);
}

    .btn-gray-color:hover, .btn-gray-color:focus, .btn-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
    }

.btn-outline-gray-color {
    background: transparent;
    border-color: var(--gray-color);
    color: var(--gray-color);
}

    .btn-outline-gray-color:hover, .btn-outline-gray-color:focus, .btn-outline-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
        box-shadow: none;
        outline: none;
    }

.text-gray-color {
    color: var(--gray-color) !important;
}

.bg-gray3 {
    background: var(--gray3) !important;
}

.btn-gray3 {
    background: var(--gray3);
    border-color: var(--gray3);
}

    .btn-gray3:hover, .btn-gray3:focus, .btn-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
    }

.btn-outline-gray3 {
    background: transparent;
    border-color: var(--gray3);
    color: var(--gray3);
}

    .btn-outline-gray3:hover, .btn-outline-gray3:focus, .btn-outline-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
        box-shadow: none;
        outline: none;
    }

.text-gray3 {
    color: var(--gray3) !important;
}

.bg-light-grey {
    background: var(--light-grey) !important;
}

.btn-light-grey {
    background: var(--light-grey);
    border-color: var(--light-grey);
}

    .btn-light-grey:hover, .btn-light-grey:focus, .btn-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
    }

.btn-outline-light-grey {
    background: transparent;
    border-color: var(--light-grey);
    color: var(--light-grey);
}

    .btn-outline-light-grey:hover, .btn-outline-light-grey:focus, .btn-outline-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
        box-shadow: none;
        outline: none;
    }

.text-light-grey {
    color: var(--light-grey) !important;
}

.fs-56 {
    font-size: clamp(30px, 30px + 0vw, 30px);
}

@media (min-width: 768px) {
    .fs-56 {
        font-size: clamp(30px, 30px + 0vw, 30px);
    }
}

@media (min-width: 1200px) {
    .fs-56 {
        font-size: clamp(30px, -13.3333333333px + 3.6111111111vw, 56px);
    }
}

.fs-40 {
    font-size: clamp(18px, 13.7142857143px + 1.3392857143vw, 24px);
}

@media (min-width: 768px) {
    .fs-40 {
        font-size: clamp(24px, 24px + 0vw, 24px);
    }
}

@media (min-width: 1200px) {
    .fs-40 {
        font-size: clamp(24px, -2.6666666667px + 2.2222222222vw, 40px);
    }
}

.fs-38 {
    font-size: clamp(18px, 15.1428571429px + 0.8928571429vw, 22px);
}

@media (min-width: 768px) {
    .fs-38 {
        font-size: clamp(22px, 22px + 0vw, 22px);
    }
}

@media (min-width: 1200px) {
    .fs-38 {
        font-size: clamp(22px, -4.6666666667px + 2.2222222222vw, 38px);
    }
}

.fs-32 {
    font-size: clamp(18px, 16.5714285714px + 0.4464285714vw, 20px);
}

@media (min-width: 768px) {
    .fs-32 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .fs-32 {
        font-size: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.fs-28 {
    font-size: clamp(16px, 14.5714285714px + 0.4464285714vw, 18px);
}

@media (min-width: 768px) {
    .fs-28 {
        font-size: clamp(18px, 18px + 0vw, 18px);
    }
}

@media (min-width: 1200px) {
    .fs-28 {
        font-size: clamp(18px, 1.3333333333px + 1.3888888889vw, 28px);
    }
}

.fs-24 {
    font-size: clamp(16px, 16px + 0vw, 16px);
}

@media (min-width: 768px) {
    .fs-24 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-24 {
        font-size: clamp(16px, 2.6666666667px + 1.1111111111vw, 24px);
    }
}

.fs-22 {
    font-size: clamp(14px, 12.5714285714px + 0.4464285714vw, 16px);
}

@media (min-width: 768px) {
    .fs-22 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-22 {
        font-size: clamp(16px, 6px + 0.8333333333vw, 22px);
    }
}

.fs-20 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-20 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-20 {
        font-size: clamp(12px, -1.3333333333px + 1.1111111111vw, 20px);
    }
}

.fs-18 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-18 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-18 {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

.fs-16 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-16 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-16 {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

.fs-15 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-15 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-15 {
        font-size: clamp(12px, 7px + 0.4166666667vw, 15px);
    }
}

.fs-14 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-14 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-14 {
        font-size: clamp(10px, 3.3333333333px + 0.5555555556vw, 14px);
    }
}

.fs-12 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-12 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-12 {
        font-size: clamp(10px, 6.6666666667px + 0.2777777778vw, 12px);
    }
}

.section-title {
    text-align: start;
}

@media (max-width: 767.98px) {
    .section-title {
        margin-bottom: 24px !important;
    }
}

@media (max-width: 991.98px) {
    .section-title {
        padding-inline: 0 !important;
    }
}

.sub-title {
    text-transform: none;
    text-align: start;
    color: var(--text-muted);
}

.breadcrumb-menu {
    background-color: var(--surface-2);
    border: 1px solid var(--border-color);
    padding: 18px 0;
}

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
        content: var(--bs-breadcrumb-divider, ">");
        color: var(--purple);
        float: inline-start !important;
        padding-inline-end: var(--bs-breadcrumb-item-padding-x) !important;
    }

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item a {
        font-weight: 400;
        font-size: 16px;
        line-height: 19px;
        letter-spacing: -0.18px;
        color: var(--text-muted);
    }

        .breadcrumb-menu nav .breadcrumb .breadcrumb-item a.active {
            color: var(--purple);
        }

.search-bar-wrapper {
    display: flex;
    justify-content: center;
    width: 100%;
}

    .search-bar-wrapper .search-bar {
        position: relative;
        display: flex;
        align-items: center;
        width: 100%;
        max-width: 700px;
    }

        .search-bar-wrapper .search-bar::before {
            content: "";
            background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.06348 1.66797C13.1481 1.66797 16.459 4.97887 16.459 9.06348C16.459 10.8046 15.8554 12.4035 14.8486 13.667L18.0938 16.9111C18.4188 17.2365 18.4189 17.7645 18.0938 18.0898C17.7684 18.4152 17.2405 18.415 16.915 18.0898L13.6709 14.8457C12.4068 15.8543 10.8064 16.459 9.06348 16.459C4.97887 16.459 1.66797 13.1481 1.66797 9.06348C1.66797 4.97887 4.97887 1.66797 9.06348 1.66797ZM9.06348 3.33398C5.89935 3.33398 3.33398 5.89935 3.33398 9.06348C3.33398 12.2276 5.89935 14.793 9.06348 14.793C12.2276 14.793 14.793 12.2276 14.793 9.06348C14.793 5.89935 12.2276 3.33398 9.06348 3.33398Z' fill='%233D126B'/%3e%3c/svg%3e");
            position: absolute;
            inset-inline-start: 20px;
            top: 50%;
            transform: translateY(-50%);
            width: 20px;
            height: 20px;
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
            z-index: 1;
            pointer-events: none;
        }

        .search-bar-wrapper .search-bar .form-control {
            width: 100%;
            padding-block: 16px;
            padding-inline-start: 55px;
            padding-inline-end: 20px;
            border: 1px solid var(--border);
            border-radius: 50px;
            font-size: 16px;
            font-weight: 400;
            color: var(--text-muted);
            background-color: var(--surface);
            transition: border-color 0.3s ease-in-out;
        }

            .search-bar-wrapper .search-bar .form-control::placeholder {
                color: var(--text-subtle);
                font-weight: 400;
            }

            .search-bar-wrapper .search-bar .form-control:focus {
                outline: none;
                border-color: var(--violet);
                box-shadow: 0 0 0 0.2rem rgba(61, 18, 107, 0.1);
            }

@media (min-width: 1200px) {
    .search-tabs #simpleTabs .nav-link {
        margin-inline: 16px;
    }
}

.documents-list__item {
    padding: 12px 0;
}

.documents-list__item-left {
    flex: 1;
    min-width: 0;
}

.documents-list__icon {
    font-size: 20px;
    color: var(--primary-accent);
    flex-shrink: 0;
}

.documents-list__title {
    color: var(--text-muted);
    font-weight: 400;
    font-size: 20px;
    line-height: 1.5;
    margin: 0;
    word-break: break-word;
}

.documents-list__button {
    height: 40px !important;
}

.news-list__item {
    padding: 0;
    margin-bottom: 20px;
}

@media (min-width: 1200px) {
    .news-list__item {
        margin-bottom: 35px;
    }
}

.news-list__meta {
    font-size: 14px;
    color: var(--text-muted);
    font-weight: 400;
    line-height: 1.5;
}

.news-list__category {
    color: var(--text-muted);
}

.news-list__separator {
    color: var(--text-muted);
}

.news-list__date {
    color: var(--text-muted);
}

.news-list__title {
    color: var(--text-muted);
    font-size: 20px;
    line-height: 1.5;
    margin: 0;
    word-break: break-word;
}

.news-list__description {
    font-weight: 400;
    line-height: 1.6;
    color: var(--text-muted);
    margin: 0;
}

.events-list__item {
    padding: 0;
    margin-bottom: 20px;
    display: flex;
    gap: 32px;
}

@media (max-width: 767.98px) {
    .events-list__item {
        gap: 12px;
    }
}

@media (max-width: 575.98px) {
    .events-list__item {
        gap: 10px;
        margin-bottom: 24px;
    }
}

@media (min-width: 1200px) {
    .events-list__item {
        margin-bottom: 40px;
    }
}

.events-list__separators {
    width: 1px;
    height: 120px;
    background-color: var(--border);
}

@media (max-width: 991.98px) {
    .events-list__separators {
        height: 90px;
    }
}

@media (max-width: 575.98px) {
    .events-list__separators {
        height: 60px;
    }
}

.events-list__date-box {
    flex-shrink: 0;
    width: 108px;
    height: 123px;
    background-color: var(--surface-3);
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 12px;
}

@media (max-width: 991.98px) {
    .events-list__date-box {
        height: 90px;
    }
}

@media (max-width: 575.98px) {
    .events-list__date-box {
        height: 60px;
    }
}

@media (max-width: 767.98px) {
    .events-list__date-box {
        width: 70px;
        height: 70px;
        padding: 10px;
        border-radius: 10px;
    }
}

@media (max-width: 575.98px) {
    .events-list__date-box {
        width: 60px;
        height: 60px;
        padding: 8px;
        border-radius: 8px;
    }
}

.events-list__date-box-day {
    font-size: 38px;
    font-weight: 600;
    color: var(--text);
    line-height: 1;
    margin-bottom: 4px;
}

@media (max-width: 767.98px) {
    .events-list__date-box-day {
        font-size: 24px;
        margin-bottom: 3px;
    }
}

@media (max-width: 575.98px) {
    .events-list__date-box-day {
        font-size: 20px;
        margin-bottom: 2px;
    }
}

.events-list__date-box-separator {
    width: 38px;
    height: 1px;
    background-color: var(--violet);
    margin: 8px 0;
    opacity: 0.3;
}

@media (max-width: 767.98px) {
    .events-list__date-box-separator {
        width: 25px;
        margin: 5px 0;
    }
}

@media (max-width: 575.98px) {
    .events-list__date-box-separator {
        width: 20px;
        margin: 2px 0;
    }
}

.events-list__date-box-month {
    font-size: 20px;
    font-weight: 600;
    color: var(--purple);
    line-height: 1;
    margin-top: 4px;
}

@media (max-width: 767.98px) {
    .events-list__date-box-month {
        font-size: 12px;
        margin-top: 3px;
    }
}

@media (max-width: 575.98px) {
    .events-list__date-box-month {
        font-size: 11px;
        margin-top: 2px;
    }
}

.events-list__item-content {
    flex: 1;
    min-width: 0;
}

.events-list__meta {
    font-size: 14px;
    color: var(--text-muted);
    font-weight: 400;
    line-height: 1.5;
}

@media (max-width: 575.98px) {
    .events-list__meta {
        font-size: 12px;
    }
}

.events-list__category {
    color: var(--text-muted);
}

.events-list__separator {
    color: var(--text-muted);
}

.events-list__date {
    color: var(--text-muted);
}

.events-list__location {
    color: var(--text-muted);
}

.events-list__title {
    color: var(--text-muted);
    font-size: 20px;
    line-height: 1.5;
    margin: 0;
    word-break: break-word;
}

@media (max-width: 767.98px) {
    .events-list__title {
        font-size: 18px;
        line-height: 1.4;
    }
}

@media (max-width: 575.98px) {
    .events-list__title {
        font-size: 16px;
        line-height: 1.4;
    }
}

.events-list__description {
    font-weight: 400;
    line-height: 1.6;
    color: var(--text-muted);
    margin: 0;
}

@media (max-width: 767.98px) {
    .events-list__description {
        font-size: 16px;
        line-height: 1.5;
    }
}

@media (max-width: 575.98px) {
    .events-list__description {
        font-size: 14px;
        line-height: 1.5;
    }
}

/*!
* Style Sheet for ""
* version: 1
* last modified:2023 By Applab
* author: Applab
* website: www.applab.qa
*/
.alert-primary {
    --bs-alert-color: var(--bs-primary-text);
    --bs-alert-bg: var(--bs-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-primary-border-subtle);
    --bs-alert-link-color: var(--bs-primary-text);
}

.alert-white {
    --bs-alert-color: var(--bs-white-text);
    --bs-alert-bg: var(--bs-white-bg-subtle);
    --bs-alert-border-color: var(--bs-white-border-subtle);
    --bs-alert-link-color: var(--bs-white-text);
}

.alert-black {
    --bs-alert-color: var(--bs-black-text);
    --bs-alert-bg: var(--bs-black-bg-subtle);
    --bs-alert-border-color: var(--bs-black-border-subtle);
    --bs-alert-link-color: var(--bs-black-text);
}

.alert-secondary {
    --bs-alert-color: var(--bs-secondary-text);
    --bs-alert-bg: var(--bs-secondary-bg-subtle);
    --bs-alert-border-color: var(--bs-secondary-border-subtle);
    --bs-alert-link-color: var(--bs-secondary-text);
}

.alert-light-primary {
    --bs-alert-color: var(--bs-light-primary-text);
    --bs-alert-bg: var(--bs-light-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-light-primary-border-subtle);
    --bs-alert-link-color: var(--bs-light-primary-text);
}

.alert-light-bg {
    --bs-alert-color: var(--bs-light-bg-text);
    --bs-alert-bg: var(--bs-light-bg-bg-subtle);
    --bs-alert-border-color: var(--bs-light-bg-border-subtle);
    --bs-alert-link-color: var(--bs-light-bg-text);
}

.alert-grey {
    --bs-alert-color: var(--bs-grey-text);
    --bs-alert-bg: var(--bs-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-grey-border-subtle);
    --bs-alert-link-color: var(--bs-grey-text);
}

.alert-purple {
    --bs-alert-color: var(--bs-purple-text);
    --bs-alert-bg: var(--bs-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-purple-border-subtle);
    --bs-alert-link-color: var(--bs-purple-text);
}

.alert-dark-purple {
    --bs-alert-color: var(--bs-dark-purple-text);
    --bs-alert-bg: var(--bs-dark-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-purple-border-subtle);
    --bs-alert-link-color: var(--bs-dark-purple-text);
}

.alert-violet {
    --bs-alert-color: var(--bs-violet-text);
    --bs-alert-bg: var(--bs-violet-bg-subtle);
    --bs-alert-border-color: var(--bs-violet-border-subtle);
    --bs-alert-link-color: var(--bs-violet-text);
}

.alert-dark-grey {
    --bs-alert-color: var(--bs-dark-grey-text);
    --bs-alert-bg: var(--bs-dark-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-grey-border-subtle);
    --bs-alert-link-color: var(--bs-dark-grey-text);
}

.alert-light-black {
    --bs-alert-color: var(--bs-light-black-text);
    --bs-alert-bg: var(--bs-light-black-bg-subtle);
    --bs-alert-border-color: var(--bs-light-black-border-subtle);
    --bs-alert-link-color: var(--bs-light-black-text);
}

.alert-border-color {
    --bs-alert-color: var(--bs-border-color-text);
    --bs-alert-bg: var(--bs-border-color-bg-subtle);
    --bs-alert-border-color: var(--bs-border-color-border-subtle);
    --bs-alert-link-color: var(--bs-border-color-text);
}

.alert-grey1 {
    --bs-alert-color: var(--bs-grey1-text);
    --bs-alert-bg: var(--bs-grey1-bg-subtle);
    --bs-alert-border-color: var(--bs-grey1-border-subtle);
    --bs-alert-link-color: var(--bs-grey1-text);
}

.alert-grey2 {
    --bs-alert-color: var(--bs-grey2-text);
    --bs-alert-bg: var(--bs-grey2-bg-subtle);
    --bs-alert-border-color: var(--bs-grey2-border-subtle);
    --bs-alert-link-color: var(--bs-grey2-text);
}

.alert-gray-color {
    --bs-alert-color: var(--bs-gray-color-text);
    --bs-alert-bg: var(--bs-gray-color-bg-subtle);
    --bs-alert-border-color: var(--bs-gray-color-border-subtle);
    --bs-alert-link-color: var(--bs-gray-color-text);
}

.alert-gray3 {
    --bs-alert-color: var(--bs-gray3-text);
    --bs-alert-bg: var(--bs-gray3-bg-subtle);
    --bs-alert-border-color: var(--bs-gray3-border-subtle);
    --bs-alert-link-color: var(--bs-gray3-text);
}

.alert-light-grey {
    --bs-alert-color: var(--bs-light-grey-text);
    --bs-alert-bg: var(--bs-light-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-light-grey-border-subtle);
    --bs-alert-link-color: var(--bs-light-grey-text);
}

.bg-primary {
    background: var(--primary) !important;
}

.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
    }

.btn-outline-primary {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary-accent);
}

    .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
        box-shadow: none;
        outline: none;
    }

.text-primary {
    color: var(--primary-accent) !important;
}

.bg-white {
    background: var(--surface) !important;
}

.btn-white {
    background: var(--surface);
    border-color: var(--on-primary);
}

    .btn-white:hover, .btn-white:focus, .btn-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
    }

.btn-outline-white {
    background: transparent;
    border-color: var(--on-primary);
    color: var(--on-primary);
}

    .btn-outline-white:hover, .btn-outline-white:focus, .btn-outline-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
        box-shadow: none;
        outline: none;
    }

.text-white {
    color: var(--on-primary) !important;
}

.bg-black {
    background: var(--black) !important;
}

.btn-black {
    background: var(--black);
    border-color: var(--black);
}

    .btn-black:hover, .btn-black:focus, .btn-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
    }

.btn-outline-black {
    background: transparent;
    border-color: var(--black);
    color: var(--text);
}

    .btn-outline-black:hover, .btn-outline-black:focus, .btn-outline-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
        box-shadow: none;
        outline: none;
    }

.text-black {
    color: var(--text) !important;
}

.bg-secondary {
    background: var(--text-muted) !important;
}

.btn-secondary {
    background: var(--text-muted);
    border-color: var(--text-muted);
}

    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
    }

.btn-outline-secondary {
    background: transparent;
    border-color: var(--text-muted);
    color: var(--text-muted);
}

    .btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
        box-shadow: none;
        outline: none;
    }

.text-secondary {
    color: var(--text-muted) !important;
}

.bg-light-primary {
    background: var(--light-primary) !important;
}

.btn-light-primary {
    background: var(--light-primary);
    border-color: var(--light-primary);
}

    .btn-light-primary:hover, .btn-light-primary:focus, .btn-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
    }

.btn-outline-light-primary {
    background: transparent;
    border-color: var(--light-primary);
    color: var(--light-primary);
}

    .btn-outline-light-primary:hover, .btn-outline-light-primary:focus, .btn-outline-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
        box-shadow: none;
        outline: none;
    }

.text-light-primary {
    color: var(--light-primary) !important;
}

.bg-light-bg {
    background: var(--light-bg) !important;
}

.btn-light-bg {
    background: var(--light-bg);
    border-color: var(--light-bg);
}

    .btn-light-bg:hover, .btn-light-bg:focus, .btn-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
    }

.btn-outline-light-bg {
    background: transparent;
    border-color: var(--light-bg);
    color: var(--light-bg);
}

    .btn-outline-light-bg:hover, .btn-outline-light-bg:focus, .btn-outline-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
        box-shadow: none;
        outline: none;
    }

.text-light-bg {
    color: var(--light-bg) !important;
}

.bg-grey {
    background: var(--grey) !important;
}

.btn-grey {
    background: var(--grey);
    border-color: var(--grey);
}

    .btn-grey:hover, .btn-grey:focus, .btn-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
    }

.btn-outline-grey {
    background: transparent;
    border-color: var(--grey);
    color: var(--grey);
}

    .btn-outline-grey:hover, .btn-outline-grey:focus, .btn-outline-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
        box-shadow: none;
        outline: none;
    }

.text-grey {
    color: var(--grey) !important;
}

.bg-purple {
    background: var(--purple) !important;
}

.btn-purple {
    background: var(--purple);
    border-color: var(--purple);
}

    .btn-purple:hover, .btn-purple:focus, .btn-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
    }

.btn-outline-purple {
    background: transparent;
    border-color: var(--purple);
    color: var(--purple);
}

    .btn-outline-purple:hover, .btn-outline-purple:focus, .btn-outline-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
        box-shadow: none;
        outline: none;
    }

.text-purple {
    color: var(--purple) !important;
}

.bg-dark-purple {
    background: var(--dark-purple) !important;
}

.btn-dark-purple {
    background: var(--dark-purple);
    border-color: var(--dark-purple);
}

    .btn-dark-purple:hover, .btn-dark-purple:focus, .btn-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
    }

.btn-outline-dark-purple {
    background: transparent;
    border-color: var(--dark-purple);
    color: var(--dark-purple);
}

    .btn-outline-dark-purple:hover, .btn-outline-dark-purple:focus, .btn-outline-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
        box-shadow: none;
        outline: none;
    }

.text-dark-purple {
    color: var(--dark-purple) !important;
}

.bg-violet {
    background: var(--violet) !important;
}

.btn-violet {
    background: var(--violet);
    border-color: var(--violet);
}

    .btn-violet:hover, .btn-violet:focus, .btn-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
    }

.btn-outline-violet {
    background: transparent;
    border-color: var(--violet);
    color: var(--primary-accent);
}

    .btn-outline-violet:hover, .btn-outline-violet:focus, .btn-outline-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
        box-shadow: none;
        outline: none;
    }

.text-violet {
    color: var(--primary-accent) !important;
}

.bg-dark-grey {
    background: var(--dark-grey) !important;
}

.btn-dark-grey {
    background: var(--dark-grey);
    border-color: var(--dark-grey);
}

    .btn-dark-grey:hover, .btn-dark-grey:focus, .btn-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
    }

.btn-outline-dark-grey {
    background: transparent;
    border-color: var(--dark-grey);
    color: var(--dark-grey);
}

    .btn-outline-dark-grey:hover, .btn-outline-dark-grey:focus, .btn-outline-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
        box-shadow: none;
        outline: none;
    }

.text-dark-grey {
    color: var(--dark-grey) !important;
}

.bg-light-black {
    background: var(--light-black) !important;
}

.btn-light-black {
    background: var(--light-black);
    border-color: var(--light-black);
}

    .btn-light-black:hover, .btn-light-black:focus, .btn-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
    }

.btn-outline-light-black {
    background: transparent;
    border-color: var(--light-black);
    color: var(--light-black);
}

    .btn-outline-light-black:hover, .btn-outline-light-black:focus, .btn-outline-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
        box-shadow: none;
        outline: none;
    }

.text-light-black {
    color: var(--light-black) !important;
}

.bg-border-color {
    background: var(--border-color) !important;
}

.btn-border-color {
    background: var(--border-color);
    border-color: var(--border-color);
}

    .btn-border-color:hover, .btn-border-color:focus, .btn-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
    }

.btn-outline-border-color {
    background: transparent;
    border-color: var(--border-color);
    color: var(--border-color);
}

    .btn-outline-border-color:hover, .btn-outline-border-color:focus, .btn-outline-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
        box-shadow: none;
        outline: none;
    }

.text-border-color {
    color: var(--border-color) !important;
}

.bg-grey1 {
    background: var(--grey1) !important;
}

.btn-grey1 {
    background: var(--grey1);
    border-color: var(--grey1);
}

    .btn-grey1:hover, .btn-grey1:focus, .btn-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
    }

.btn-outline-grey1 {
    background: transparent;
    border-color: var(--grey1);
    color: var(--grey1);
}

    .btn-outline-grey1:hover, .btn-outline-grey1:focus, .btn-outline-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
        box-shadow: none;
        outline: none;
    }

.text-grey1 {
    color: var(--grey1) !important;
}

.bg-grey2 {
    background: var(--grey2) !important;
}

.btn-grey2 {
    background: var(--grey2);
    border-color: var(--grey2);
}

    .btn-grey2:hover, .btn-grey2:focus, .btn-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
    }

.btn-outline-grey2 {
    background: transparent;
    border-color: var(--grey2);
    color: var(--grey2);
}

    .btn-outline-grey2:hover, .btn-outline-grey2:focus, .btn-outline-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
        box-shadow: none;
        outline: none;
    }

.text-grey2 {
    color: var(--grey2) !important;
}

.bg-gray-color {
    background: var(--gray-color) !important;
}

.btn-gray-color {
    background: var(--gray-color);
    border-color: var(--gray-color);
}

    .btn-gray-color:hover, .btn-gray-color:focus, .btn-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
    }

.btn-outline-gray-color {
    background: transparent;
    border-color: var(--gray-color);
    color: var(--gray-color);
}

    .btn-outline-gray-color:hover, .btn-outline-gray-color:focus, .btn-outline-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
        box-shadow: none;
        outline: none;
    }

.text-gray-color {
    color: var(--gray-color) !important;
}

.bg-gray3 {
    background: var(--gray3) !important;
}

.btn-gray3 {
    background: var(--gray3);
    border-color: var(--gray3);
}

    .btn-gray3:hover, .btn-gray3:focus, .btn-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
    }

.btn-outline-gray3 {
    background: transparent;
    border-color: var(--gray3);
    color: var(--gray3);
}

    .btn-outline-gray3:hover, .btn-outline-gray3:focus, .btn-outline-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
        box-shadow: none;
        outline: none;
    }

.text-gray3 {
    color: var(--gray3) !important;
}

.bg-light-grey {
    background: var(--light-grey) !important;
}

.btn-light-grey {
    background: var(--light-grey);
    border-color: var(--light-grey);
}

    .btn-light-grey:hover, .btn-light-grey:focus, .btn-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
    }

.btn-outline-light-grey {
    background: transparent;
    border-color: var(--light-grey);
    color: var(--light-grey);
}

    .btn-outline-light-grey:hover, .btn-outline-light-grey:focus, .btn-outline-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
        box-shadow: none;
        outline: none;
    }

.text-light-grey {
    color: var(--light-grey) !important;
}

.fs-56 {
    font-size: clamp(30px, 30px + 0vw, 30px);
}

@media (min-width: 768px) {
    .fs-56 {
        font-size: clamp(30px, 30px + 0vw, 30px);
    }
}

@media (min-width: 1200px) {
    .fs-56 {
        font-size: clamp(30px, -13.3333333333px + 3.6111111111vw, 56px);
    }
}

.fs-40 {
    font-size: clamp(18px, 13.7142857143px + 1.3392857143vw, 24px);
}

@media (min-width: 768px) {
    .fs-40 {
        font-size: clamp(24px, 24px + 0vw, 24px);
    }
}

@media (min-width: 1200px) {
    .fs-40 {
        font-size: clamp(24px, -2.6666666667px + 2.2222222222vw, 40px);
    }
}

.fs-38 {
    font-size: clamp(18px, 15.1428571429px + 0.8928571429vw, 22px);
}

@media (min-width: 768px) {
    .fs-38 {
        font-size: clamp(22px, 22px + 0vw, 22px);
    }
}

@media (min-width: 1200px) {
    .fs-38 {
        font-size: clamp(22px, -4.6666666667px + 2.2222222222vw, 38px);
    }
}

.fs-32 {
    font-size: clamp(18px, 16.5714285714px + 0.4464285714vw, 20px);
}

@media (min-width: 768px) {
    .fs-32 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .fs-32 {
        font-size: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.fs-28 {
    font-size: clamp(16px, 14.5714285714px + 0.4464285714vw, 18px);
}

@media (min-width: 768px) {
    .fs-28 {
        font-size: clamp(18px, 18px + 0vw, 18px);
    }
}

@media (min-width: 1200px) {
    .fs-28 {
        font-size: clamp(18px, 1.3333333333px + 1.3888888889vw, 28px);
    }
}

.fs-24 {
    font-size: clamp(16px, 16px + 0vw, 16px);
}

@media (min-width: 768px) {
    .fs-24 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-24 {
        font-size: clamp(16px, 2.6666666667px + 1.1111111111vw, 24px);
    }
}

.fs-22 {
    font-size: clamp(14px, 12.5714285714px + 0.4464285714vw, 16px);
}

@media (min-width: 768px) {
    .fs-22 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-22 {
        font-size: clamp(16px, 6px + 0.8333333333vw, 22px);
    }
}

.fs-20 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-20 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-20 {
        font-size: clamp(12px, -1.3333333333px + 1.1111111111vw, 20px);
    }
}

.fs-18 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-18 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-18 {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

.fs-16 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-16 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-16 {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

.fs-15 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-15 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-15 {
        font-size: clamp(12px, 7px + 0.4166666667vw, 15px);
    }
}

.fs-14 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-14 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-14 {
        font-size: clamp(10px, 3.3333333333px + 0.5555555556vw, 14px);
    }
}

.fs-12 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-12 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-12 {
        font-size: clamp(10px, 6.6666666667px + 0.2777777778vw, 12px);
    }
}

.section-title {
    text-align: start;
}

@media (max-width: 767.98px) {
    .section-title {
        margin-bottom: 24px !important;
    }
}

@media (max-width: 991.98px) {
    .section-title {
        padding-inline: 0 !important;
    }
}

.sub-title {
    text-transform: none;
    text-align: start;
    color: var(--text-muted);
}

.breadcrumb-menu {
    background-color: var(--surface-2);
    border: 1px solid var(--border-color);
    padding: 18px 0;
}

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
        content: var(--bs-breadcrumb-divider, ">");
        color: var(--purple);
        float: inline-start !important;
        padding-inline-end: var(--bs-breadcrumb-item-padding-x) !important;
    }

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item a {
        font-weight: 400;
        font-size: 16px;
        line-height: 19px;
        letter-spacing: -0.18px;
        color: var(--text-muted);
    }

        .breadcrumb-menu nav .breadcrumb .breadcrumb-item a.active {
            color: var(--purple);
        }

.enquiry-tabs-scroller {
    position: relative;
}

.enquiry-tabs-wrapper {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: transparent transparent;
    -ms-overflow-style: none;
    display: flex;
    justify-content: safe center;
}

    /* Desktop: reveal the scrollbar only on hover (space reserved, so no layout shift). */
    .enquiry-tabs-wrapper:hover {
        scrollbar-color: rgba(96, 63, 131, 0.5) transparent;
    }

    .enquiry-tabs-wrapper::-webkit-scrollbar {
        height: 6px;
    }

    .enquiry-tabs-wrapper::-webkit-scrollbar-track {
        background: transparent;
    }

    .enquiry-tabs-wrapper::-webkit-scrollbar-thumb {
        background: transparent;
        border-radius: 3px;
    }

    .enquiry-tabs-wrapper:hover::-webkit-scrollbar-thumb {
        background: rgba(96, 63, 131, 0.5);
    }

    /* Keep the strip content-width so the wrapper actually overflows and scrolls. */
    .enquiry-tabs-wrapper .enquiry-tabs {
        display: flex;
        flex-wrap: nowrap;
        flex-shrink: 0;
        padding-inline: 0;
    }

/* Scroll arrows — shown only on mobile/tablet to hint that the tabs scroll. */
.enquiry-tabs-arrow {
    display: none;
}

@media (max-width: 991.98px) {
    .enquiry-tabs-scroller.is-scrollable .enquiry-tabs-arrow {
        position: absolute;
        top: 0;
        bottom: 0;
        width: 34px;
        display: flex;
        align-items: center;
        border: none;
        padding: 0;
        cursor: pointer;
        color: var(--primary, var(--primary-accent));
        z-index: 3;
    }

    .enquiry-tabs-scroller.is-scrollable .enquiry-tabs-arrow--prev {
        inset-inline-start: 0;
        justify-content: flex-start;
        background: linear-gradient(to right, var(--surface) 55%, rgba(255, 255, 255, 0));
    }

    .enquiry-tabs-scroller.is-scrollable .enquiry-tabs-arrow--next {
        inset-inline-end: 0;
        justify-content: flex-end;
        background: linear-gradient(to left, var(--surface) 55%, rgba(255, 255, 255, 0));
    }

    .enquiry-tabs-scroller.is-scrollable .enquiry-tabs-arrow.is-hidden {
        display: none;
    }

    html[dir=rtl] .enquiry-tabs-arrow svg {
        transform: scaleX(-1);
    }
}

@media (max-width: 767.98px) {
    .enquiry-tabs-wrapper .enquiry-tabs {
        padding-inline: 15px;
    }
}

.enquiry-tabs-wrapper .enquiry-tabs #simpleTabs {
    display: flex !important;
    flex-wrap: nowrap !important;
    white-space: nowrap;
    width: max-content;
    margin: 0;
    padding: 0;
    list-style: none;
}

    .enquiry-tabs-wrapper .enquiry-tabs #simpleTabs .nav-item {
        flex-shrink: 0 !important;
        display: flex;
    }

@media (max-width: 767.98px) {
    .enquiry-tabs-wrapper .enquiry-tabs #simpleTabs .nav-item:first-child .nav-link {
        margin-inline-start: 0;
    }
}

@media (max-width: 767.98px) {
    .enquiry-tabs-wrapper .enquiry-tabs #simpleTabs .nav-item:last-child .nav-link {
        margin-inline-end: 0;
    }
}

.enquiry-tabs-wrapper .enquiry-tabs #simpleTabs .nav-item .nav-link {
    padding-inline: 0;
    margin-inline: 18px;
    white-space: nowrap;
    font-weight: 400;
}

@media (max-width: 991.98px) {
    .enquiry-tabs-wrapper .enquiry-tabs #simpleTabs .nav-item .nav-link {
        margin-inline: 8px;
    }
}

@media (max-width: 767.98px) {
    .enquiry-tabs-wrapper .enquiry-tabs #simpleTabs .nav-item .nav-link {
        margin-inline: 12px;
        font-size: 18px !important;
        font-weight: 500;
        padding-block: 12px;
        line-height: 1.4;
    }
}

@media (max-width: 575.98px) {
    .enquiry-tabs-wrapper .enquiry-tabs #simpleTabs .nav-item .nav-link {
        font-size: 16px !important;
        margin-inline: 10px;
    }
}

@media (max-width: 767.98px) {
    .enquiry-tabs-wrapper .enquiry-tabs #simpleTabs .nav-item .nav-link.active {
        font-weight: 700;
    }
}

.apply-qfc .radio-label {
    font-size: 16px;
}

.form-wrapper label {
    margin-bottom: 0 !important;
}

/*!
* Style Sheet for ""
* version: 1
* last modified:2023 By Applab
* author: Applab
* website: www.applab.qa
*/
.alert-primary {
    --bs-alert-color: var(--bs-primary-text);
    --bs-alert-bg: var(--bs-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-primary-border-subtle);
    --bs-alert-link-color: var(--bs-primary-text);
}

.alert-white {
    --bs-alert-color: var(--bs-white-text);
    --bs-alert-bg: var(--bs-white-bg-subtle);
    --bs-alert-border-color: var(--bs-white-border-subtle);
    --bs-alert-link-color: var(--bs-white-text);
}

.alert-black {
    --bs-alert-color: var(--bs-black-text);
    --bs-alert-bg: var(--bs-black-bg-subtle);
    --bs-alert-border-color: var(--bs-black-border-subtle);
    --bs-alert-link-color: var(--bs-black-text);
}

.alert-secondary {
    --bs-alert-color: var(--bs-secondary-text);
    --bs-alert-bg: var(--bs-secondary-bg-subtle);
    --bs-alert-border-color: var(--bs-secondary-border-subtle);
    --bs-alert-link-color: var(--bs-secondary-text);
}

.alert-light-primary {
    --bs-alert-color: var(--bs-light-primary-text);
    --bs-alert-bg: var(--bs-light-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-light-primary-border-subtle);
    --bs-alert-link-color: var(--bs-light-primary-text);
}

.alert-light-bg {
    --bs-alert-color: var(--bs-light-bg-text);
    --bs-alert-bg: var(--bs-light-bg-bg-subtle);
    --bs-alert-border-color: var(--bs-light-bg-border-subtle);
    --bs-alert-link-color: var(--bs-light-bg-text);
}

.alert-grey {
    --bs-alert-color: var(--bs-grey-text);
    --bs-alert-bg: var(--bs-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-grey-border-subtle);
    --bs-alert-link-color: var(--bs-grey-text);
}

.alert-purple {
    --bs-alert-color: var(--bs-purple-text);
    --bs-alert-bg: var(--bs-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-purple-border-subtle);
    --bs-alert-link-color: var(--bs-purple-text);
}

.alert-dark-purple {
    --bs-alert-color: var(--bs-dark-purple-text);
    --bs-alert-bg: var(--bs-dark-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-purple-border-subtle);
    --bs-alert-link-color: var(--bs-dark-purple-text);
}

.alert-violet {
    --bs-alert-color: var(--bs-violet-text);
    --bs-alert-bg: var(--bs-violet-bg-subtle);
    --bs-alert-border-color: var(--bs-violet-border-subtle);
    --bs-alert-link-color: var(--bs-violet-text);
}

.alert-dark-grey {
    --bs-alert-color: var(--bs-dark-grey-text);
    --bs-alert-bg: var(--bs-dark-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-grey-border-subtle);
    --bs-alert-link-color: var(--bs-dark-grey-text);
}

.alert-light-black {
    --bs-alert-color: var(--bs-light-black-text);
    --bs-alert-bg: var(--bs-light-black-bg-subtle);
    --bs-alert-border-color: var(--bs-light-black-border-subtle);
    --bs-alert-link-color: var(--bs-light-black-text);
}

.alert-border-color {
    --bs-alert-color: var(--bs-border-color-text);
    --bs-alert-bg: var(--bs-border-color-bg-subtle);
    --bs-alert-border-color: var(--bs-border-color-border-subtle);
    --bs-alert-link-color: var(--bs-border-color-text);
}

.alert-grey1 {
    --bs-alert-color: var(--bs-grey1-text);
    --bs-alert-bg: var(--bs-grey1-bg-subtle);
    --bs-alert-border-color: var(--bs-grey1-border-subtle);
    --bs-alert-link-color: var(--bs-grey1-text);
}

.alert-grey2 {
    --bs-alert-color: var(--bs-grey2-text);
    --bs-alert-bg: var(--bs-grey2-bg-subtle);
    --bs-alert-border-color: var(--bs-grey2-border-subtle);
    --bs-alert-link-color: var(--bs-grey2-text);
}

.alert-gray-color {
    --bs-alert-color: var(--bs-gray-color-text);
    --bs-alert-bg: var(--bs-gray-color-bg-subtle);
    --bs-alert-border-color: var(--bs-gray-color-border-subtle);
    --bs-alert-link-color: var(--bs-gray-color-text);
}

.alert-gray3 {
    --bs-alert-color: var(--bs-gray3-text);
    --bs-alert-bg: var(--bs-gray3-bg-subtle);
    --bs-alert-border-color: var(--bs-gray3-border-subtle);
    --bs-alert-link-color: var(--bs-gray3-text);
}

.alert-light-grey {
    --bs-alert-color: var(--bs-light-grey-text);
    --bs-alert-bg: var(--bs-light-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-light-grey-border-subtle);
    --bs-alert-link-color: var(--bs-light-grey-text);
}

.bg-primary {
    background: var(--primary) !important;
}

.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
    }

.btn-outline-primary {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary-accent);
}

    .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
        box-shadow: none;
        outline: none;
    }

.text-primary {
    color: var(--primary-accent) !important;
}

.bg-white {
    background: var(--surface) !important;
}

.btn-white {
    background: var(--surface);
    border-color: var(--on-primary);
}

    .btn-white:hover, .btn-white:focus, .btn-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
    }

.btn-outline-white {
    background: transparent;
    border-color: var(--on-primary);
    color: var(--on-primary);
}

    .btn-outline-white:hover, .btn-outline-white:focus, .btn-outline-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
        box-shadow: none;
        outline: none;
    }

.text-white {
    color: var(--on-primary) !important;
}

.bg-black {
    background: var(--black) !important;
}

.btn-black {
    background: var(--black);
    border-color: var(--black);
}

    .btn-black:hover, .btn-black:focus, .btn-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
    }

.btn-outline-black {
    background: transparent;
    border-color: var(--black);
    color: var(--text);
}

    .btn-outline-black:hover, .btn-outline-black:focus, .btn-outline-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
        box-shadow: none;
        outline: none;
    }

.text-black {
    color: var(--text) !important;
}

.bg-secondary {
    background: var(--text-muted) !important;
}

.btn-secondary {
    background: var(--text-muted);
    border-color: var(--text-muted);
}

    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
    }

.btn-outline-secondary {
    background: transparent;
    border-color: var(--text-muted);
    color: var(--text-muted);
}

    .btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
        box-shadow: none;
        outline: none;
    }

.text-secondary {
    color: var(--text-muted) !important;
}

.bg-light-primary {
    background: var(--light-primary) !important;
}

.btn-light-primary {
    background: var(--light-primary);
    border-color: var(--light-primary);
}

    .btn-light-primary:hover, .btn-light-primary:focus, .btn-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
    }

.btn-outline-light-primary {
    background: transparent;
    border-color: var(--light-primary);
    color: var(--light-primary);
}

    .btn-outline-light-primary:hover, .btn-outline-light-primary:focus, .btn-outline-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
        box-shadow: none;
        outline: none;
    }

.text-light-primary {
    color: var(--light-primary) !important;
}

.bg-light-bg {
    background: var(--light-bg) !important;
}

.btn-light-bg {
    background: var(--light-bg);
    border-color: var(--light-bg);
}

    .btn-light-bg:hover, .btn-light-bg:focus, .btn-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
    }

.btn-outline-light-bg {
    background: transparent;
    border-color: var(--light-bg);
    color: var(--light-bg);
}

    .btn-outline-light-bg:hover, .btn-outline-light-bg:focus, .btn-outline-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
        box-shadow: none;
        outline: none;
    }

.text-light-bg {
    color: var(--light-bg) !important;
}

.bg-grey {
    background: var(--grey) !important;
}

.btn-grey {
    background: var(--grey);
    border-color: var(--grey);
}

    .btn-grey:hover, .btn-grey:focus, .btn-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
    }

.btn-outline-grey {
    background: transparent;
    border-color: var(--grey);
    color: var(--grey);
}

    .btn-outline-grey:hover, .btn-outline-grey:focus, .btn-outline-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
        box-shadow: none;
        outline: none;
    }

.text-grey {
    color: var(--grey) !important;
}

.bg-purple {
    background: var(--purple) !important;
}

.btn-purple {
    background: var(--purple);
    border-color: var(--purple);
}

    .btn-purple:hover, .btn-purple:focus, .btn-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
    }

.btn-outline-purple {
    background: transparent;
    border-color: var(--purple);
    color: var(--purple);
}

    .btn-outline-purple:hover, .btn-outline-purple:focus, .btn-outline-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
        box-shadow: none;
        outline: none;
    }

.text-purple {
    color: var(--purple) !important;
}

.bg-dark-purple {
    background: var(--dark-purple) !important;
}

.btn-dark-purple {
    background: var(--dark-purple);
    border-color: var(--dark-purple);
}

    .btn-dark-purple:hover, .btn-dark-purple:focus, .btn-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
    }

.btn-outline-dark-purple {
    background: transparent;
    border-color: var(--dark-purple);
    color: var(--dark-purple);
}

    .btn-outline-dark-purple:hover, .btn-outline-dark-purple:focus, .btn-outline-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
        box-shadow: none;
        outline: none;
    }

.text-dark-purple {
    color: var(--dark-purple) !important;
}

.bg-violet {
    background: var(--violet) !important;
}

.btn-violet {
    background: var(--violet);
    border-color: var(--violet);
}

    .btn-violet:hover, .btn-violet:focus, .btn-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
    }

.btn-outline-violet {
    background: transparent;
    border-color: var(--violet);
    color: var(--primary-accent);
}

    .btn-outline-violet:hover, .btn-outline-violet:focus, .btn-outline-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
        box-shadow: none;
        outline: none;
    }

.text-violet {
    color: var(--primary-accent) !important;
}

.bg-dark-grey {
    background: var(--dark-grey) !important;
}

.btn-dark-grey {
    background: var(--dark-grey);
    border-color: var(--dark-grey);
}

    .btn-dark-grey:hover, .btn-dark-grey:focus, .btn-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
    }

.btn-outline-dark-grey {
    background: transparent;
    border-color: var(--dark-grey);
    color: var(--dark-grey);
}

    .btn-outline-dark-grey:hover, .btn-outline-dark-grey:focus, .btn-outline-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
        box-shadow: none;
        outline: none;
    }

.text-dark-grey {
    color: var(--dark-grey) !important;
}

.bg-light-black {
    background: var(--light-black) !important;
}

.btn-light-black {
    background: var(--light-black);
    border-color: var(--light-black);
}

    .btn-light-black:hover, .btn-light-black:focus, .btn-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
    }

.btn-outline-light-black {
    background: transparent;
    border-color: var(--light-black);
    color: var(--light-black);
}

    .btn-outline-light-black:hover, .btn-outline-light-black:focus, .btn-outline-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
        box-shadow: none;
        outline: none;
    }

.text-light-black {
    color: var(--light-black) !important;
}

.bg-border-color {
    background: var(--border-color) !important;
}

.btn-border-color {
    background: var(--border-color);
    border-color: var(--border-color);
}

    .btn-border-color:hover, .btn-border-color:focus, .btn-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
    }

.btn-outline-border-color {
    background: transparent;
    border-color: var(--border-color);
    color: var(--border-color);
}

    .btn-outline-border-color:hover, .btn-outline-border-color:focus, .btn-outline-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
        box-shadow: none;
        outline: none;
    }

.text-border-color {
    color: var(--border-color) !important;
}

.bg-grey1 {
    background: var(--grey1) !important;
}

.btn-grey1 {
    background: var(--grey1);
    border-color: var(--grey1);
}

    .btn-grey1:hover, .btn-grey1:focus, .btn-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
    }

.btn-outline-grey1 {
    background: transparent;
    border-color: var(--grey1);
    color: var(--grey1);
}

    .btn-outline-grey1:hover, .btn-outline-grey1:focus, .btn-outline-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
        box-shadow: none;
        outline: none;
    }

.text-grey1 {
    color: var(--grey1) !important;
}

.bg-grey2 {
    background: var(--grey2) !important;
}

.btn-grey2 {
    background: var(--grey2);
    border-color: var(--grey2);
}

    .btn-grey2:hover, .btn-grey2:focus, .btn-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
    }

.btn-outline-grey2 {
    background: transparent;
    border-color: var(--grey2);
    color: var(--grey2);
}

    .btn-outline-grey2:hover, .btn-outline-grey2:focus, .btn-outline-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
        box-shadow: none;
        outline: none;
    }

.text-grey2 {
    color: var(--grey2) !important;
}

.bg-gray-color {
    background: var(--gray-color) !important;
}

.btn-gray-color {
    background: var(--gray-color);
    border-color: var(--gray-color);
}

    .btn-gray-color:hover, .btn-gray-color:focus, .btn-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
    }

.btn-outline-gray-color {
    background: transparent;
    border-color: var(--gray-color);
    color: var(--gray-color);
}

    .btn-outline-gray-color:hover, .btn-outline-gray-color:focus, .btn-outline-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
        box-shadow: none;
        outline: none;
    }

.text-gray-color {
    color: var(--gray-color) !important;
}

.bg-gray3 {
    background: var(--gray3) !important;
}

.btn-gray3 {
    background: var(--gray3);
    border-color: var(--gray3);
}

    .btn-gray3:hover, .btn-gray3:focus, .btn-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
    }

.btn-outline-gray3 {
    background: transparent;
    border-color: var(--gray3);
    color: var(--gray3);
}

    .btn-outline-gray3:hover, .btn-outline-gray3:focus, .btn-outline-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
        box-shadow: none;
        outline: none;
    }

.text-gray3 {
    color: var(--gray3) !important;
}

.bg-light-grey {
    background: var(--light-grey) !important;
}

.btn-light-grey {
    background: var(--light-grey);
    border-color: var(--light-grey);
}

    .btn-light-grey:hover, .btn-light-grey:focus, .btn-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
    }

.btn-outline-light-grey {
    background: transparent;
    border-color: var(--light-grey);
    color: var(--light-grey);
}

    .btn-outline-light-grey:hover, .btn-outline-light-grey:focus, .btn-outline-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
        box-shadow: none;
        outline: none;
    }

.text-light-grey {
    color: var(--light-grey) !important;
}

.fs-56 {
    font-size: clamp(30px, 30px + 0vw, 30px);
}

@media (min-width: 768px) {
    .fs-56 {
        font-size: clamp(30px, 30px + 0vw, 30px);
    }
}

@media (min-width: 1200px) {
    .fs-56 {
        font-size: clamp(30px, -13.3333333333px + 3.6111111111vw, 56px);
    }
}

.fs-40 {
    font-size: clamp(18px, 13.7142857143px + 1.3392857143vw, 24px);
}

@media (min-width: 768px) {
    .fs-40 {
        font-size: clamp(24px, 24px + 0vw, 24px);
    }
}

@media (min-width: 1200px) {
    .fs-40 {
        font-size: clamp(24px, -2.6666666667px + 2.2222222222vw, 40px);
    }
}

.fs-38 {
    font-size: clamp(18px, 15.1428571429px + 0.8928571429vw, 22px);
}

@media (min-width: 768px) {
    .fs-38 {
        font-size: clamp(22px, 22px + 0vw, 22px);
    }
}

@media (min-width: 1200px) {
    .fs-38 {
        font-size: clamp(22px, -4.6666666667px + 2.2222222222vw, 38px);
    }
}

.fs-32 {
    font-size: clamp(18px, 16.5714285714px + 0.4464285714vw, 20px);
}

@media (min-width: 768px) {
    .fs-32 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .fs-32 {
        font-size: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.fs-28 {
    font-size: clamp(16px, 14.5714285714px + 0.4464285714vw, 18px);
}

@media (min-width: 768px) {
    .fs-28 {
        font-size: clamp(18px, 18px + 0vw, 18px);
    }
}

@media (min-width: 1200px) {
    .fs-28 {
        font-size: clamp(18px, 1.3333333333px + 1.3888888889vw, 28px);
    }
}

.fs-24 {
    font-size: clamp(16px, 16px + 0vw, 16px);
}

@media (min-width: 768px) {
    .fs-24 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-24 {
        font-size: clamp(16px, 2.6666666667px + 1.1111111111vw, 24px);
    }
}

.fs-22 {
    font-size: clamp(14px, 12.5714285714px + 0.4464285714vw, 16px);
}

@media (min-width: 768px) {
    .fs-22 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-22 {
        font-size: clamp(16px, 6px + 0.8333333333vw, 22px);
    }
}

.fs-20 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-20 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-20 {
        font-size: clamp(12px, -1.3333333333px + 1.1111111111vw, 20px);
    }
}

.fs-18 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-18 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-18 {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

.fs-16 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-16 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-16 {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

.fs-15 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-15 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-15 {
        font-size: clamp(12px, 7px + 0.4166666667vw, 15px);
    }
}

.fs-14 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-14 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-14 {
        font-size: clamp(10px, 3.3333333333px + 0.5555555556vw, 14px);
    }
}

.fs-12 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-12 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-12 {
        font-size: clamp(10px, 6.6666666667px + 0.2777777778vw, 12px);
    }
}

.section-title {
    text-align: start;
}

@media (max-width: 767.98px) {
    .section-title {
        margin-bottom: 24px !important;
    }
}

@media (max-width: 991.98px) {
    .section-title {
        padding-inline: 0 !important;
    }
}

.sub-title {
    text-transform: none;
    text-align: start;
    color: var(--text-muted);
}

.breadcrumb-menu {
    background-color: var(--surface-2);
    border: 1px solid var(--border-color);
    padding: 18px 0;
}

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
        content: var(--bs-breadcrumb-divider, ">");
        color: var(--purple);
        float: inline-start !important;
        padding-inline-end: var(--bs-breadcrumb-item-padding-x) !important;
    }

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item a {
        font-weight: 400;
        font-size: 16px;
        line-height: 19px;
        letter-spacing: -0.18px;
        color: var(--text-muted);
    }

        .breadcrumb-menu nav .breadcrumb .breadcrumb-item a.active {
            color: var(--purple);
        }

.business-tabs-nav {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

@media (max-width: 991.98px) {
    .business-tabs-nav {
        flex-direction: row;
        overflow-x: auto;
        margin-bottom: 24px;
        padding-bottom: 8px;
        gap: clamp(12px, 3.4285714286px + 2.6785714286vw, 24px);
    }
}

@media (max-width: 991.98px) and (min-width: 768px) {
    .business-tabs-nav {
        gap: clamp(24px, 9.7777777778px + 1.8518518519vw, 32px);
    }
}

@media (max-width: 991.98px) and (min-width: 1200px) {
    .business-tabs-nav {
        gap: clamp(32px, 18.6666666667px + 1.1111111111vw, 40px);
    }
}

.business-tabs-content {
    min-height: 400px;
}

.business p {
    color: var(--text-muted);
}

.business-tab-btn {
    display: block;
    width: 100%;
    padding: 16px 24px;
    border: 1px solid var(--border);
    border-radius: 8px;
    font-size: 16px;
    font-weight: 400;
    color: var(--text-muted);
    text-align: left;
    transition: all 0.3s ease-in-out;
    cursor: pointer;
}

@media (min-width: 1200px) {
    .business-tab-btn {
        max-width: 86%;
    }
}

.business-tab-btn:hover {
    border: 1px solid var(--Black-black-200, var(--border-strong));
    box-shadow: 0px 5px 5.2px 0px rgba(0, 0, 0, 0.08);
    color: var(--text);
}

.business-tab-btn.active {
    background: var(--surface-2);
    border-color: var(--border-strong);
    color: var(--text);
    border-width: 1px;
    font-weight: 500;
    color: var(--text);
    border: 1px solid var(--Black-black-200, var(--border-strong));
    box-shadow: 0px 5px 5.2px 0px rgba(0, 0, 0, 0.08);
}

@media (max-width: 991.98px) {
    .business-tab-btn {
        min-width: 180px;
        text-align: center;
    }
}

.business-tab-content .tab-pane h3,
.business-tab-content .tab-pane p,
.business-tab-content .tab-pane .business-sub-links {
    opacity: 0;
}

.business-tab-content .tab-pane.active h3,
.business-tab-content .tab-pane.active p,
.business-tab-content .tab-pane.active .business-sub-links {
    opacity: 1;
    animation: fadeIn 0.3s ease-in-out;
}

.business-sub-links {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 24px;
}

.business-sub-link {
    display: inline-flex;
    align-items: center;
    font-size: 14px;
    font-weight: 500;
    color: var(--primary-accent);
    text-decoration: none;
    transition: all 0.3s ease-in-out;
}

    .business-sub-link:hover {
        text-decoration: underline;
        transform: translateX(4px);
    }

.business ul {
    list-style: disc !important;
    padding-left: 20px;
    margin-top: 0;
    margin-bottom: 0;
}

    .business ul li {
        font-size: 18px;
        line-height: 1.6;
        color: var(--text);
        margin-bottom: 12px;
        list-style: disc !important;
        color: var(--text-muted);
    }

        .business ul li:last-child {
            margin-bottom: 0;
        }

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/*!
* Style Sheet for ""
* version: 1
* last modified:2023 By Applab
* author: Applab
* website: www.applab.qa
*/
.alert-primary {
    --bs-alert-color: var(--bs-primary-text);
    --bs-alert-bg: var(--bs-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-primary-border-subtle);
    --bs-alert-link-color: var(--bs-primary-text);
}

.alert-white {
    --bs-alert-color: var(--bs-white-text);
    --bs-alert-bg: var(--bs-white-bg-subtle);
    --bs-alert-border-color: var(--bs-white-border-subtle);
    --bs-alert-link-color: var(--bs-white-text);
}

.alert-black {
    --bs-alert-color: var(--bs-black-text);
    --bs-alert-bg: var(--bs-black-bg-subtle);
    --bs-alert-border-color: var(--bs-black-border-subtle);
    --bs-alert-link-color: var(--bs-black-text);
}

.alert-secondary {
    --bs-alert-color: var(--bs-secondary-text);
    --bs-alert-bg: var(--bs-secondary-bg-subtle);
    --bs-alert-border-color: var(--bs-secondary-border-subtle);
    --bs-alert-link-color: var(--bs-secondary-text);
}

.alert-light-primary {
    --bs-alert-color: var(--bs-light-primary-text);
    --bs-alert-bg: var(--bs-light-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-light-primary-border-subtle);
    --bs-alert-link-color: var(--bs-light-primary-text);
}

.alert-light-bg {
    --bs-alert-color: var(--bs-light-bg-text);
    --bs-alert-bg: var(--bs-light-bg-bg-subtle);
    --bs-alert-border-color: var(--bs-light-bg-border-subtle);
    --bs-alert-link-color: var(--bs-light-bg-text);
}

.alert-grey {
    --bs-alert-color: var(--bs-grey-text);
    --bs-alert-bg: var(--bs-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-grey-border-subtle);
    --bs-alert-link-color: var(--bs-grey-text);
}

.alert-purple {
    --bs-alert-color: var(--bs-purple-text);
    --bs-alert-bg: var(--bs-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-purple-border-subtle);
    --bs-alert-link-color: var(--bs-purple-text);
}

.alert-dark-purple {
    --bs-alert-color: var(--bs-dark-purple-text);
    --bs-alert-bg: var(--bs-dark-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-purple-border-subtle);
    --bs-alert-link-color: var(--bs-dark-purple-text);
}

.alert-violet {
    --bs-alert-color: var(--bs-violet-text);
    --bs-alert-bg: var(--bs-violet-bg-subtle);
    --bs-alert-border-color: var(--bs-violet-border-subtle);
    --bs-alert-link-color: var(--bs-violet-text);
}

.alert-dark-grey {
    --bs-alert-color: var(--bs-dark-grey-text);
    --bs-alert-bg: var(--bs-dark-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-grey-border-subtle);
    --bs-alert-link-color: var(--bs-dark-grey-text);
}

.alert-light-black {
    --bs-alert-color: var(--bs-light-black-text);
    --bs-alert-bg: var(--bs-light-black-bg-subtle);
    --bs-alert-border-color: var(--bs-light-black-border-subtle);
    --bs-alert-link-color: var(--bs-light-black-text);
}

.alert-border-color {
    --bs-alert-color: var(--bs-border-color-text);
    --bs-alert-bg: var(--bs-border-color-bg-subtle);
    --bs-alert-border-color: var(--bs-border-color-border-subtle);
    --bs-alert-link-color: var(--bs-border-color-text);
}

.alert-grey1 {
    --bs-alert-color: var(--bs-grey1-text);
    --bs-alert-bg: var(--bs-grey1-bg-subtle);
    --bs-alert-border-color: var(--bs-grey1-border-subtle);
    --bs-alert-link-color: var(--bs-grey1-text);
}

.alert-grey2 {
    --bs-alert-color: var(--bs-grey2-text);
    --bs-alert-bg: var(--bs-grey2-bg-subtle);
    --bs-alert-border-color: var(--bs-grey2-border-subtle);
    --bs-alert-link-color: var(--bs-grey2-text);
}

.alert-gray-color {
    --bs-alert-color: var(--bs-gray-color-text);
    --bs-alert-bg: var(--bs-gray-color-bg-subtle);
    --bs-alert-border-color: var(--bs-gray-color-border-subtle);
    --bs-alert-link-color: var(--bs-gray-color-text);
}

.alert-gray3 {
    --bs-alert-color: var(--bs-gray3-text);
    --bs-alert-bg: var(--bs-gray3-bg-subtle);
    --bs-alert-border-color: var(--bs-gray3-border-subtle);
    --bs-alert-link-color: var(--bs-gray3-text);
}

.alert-light-grey {
    --bs-alert-color: var(--bs-light-grey-text);
    --bs-alert-bg: var(--bs-light-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-light-grey-border-subtle);
    --bs-alert-link-color: var(--bs-light-grey-text);
}

.bg-primary {
    background: var(--primary) !important;
}

.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
    }

.btn-outline-primary {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary-accent);
}

    .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
        box-shadow: none;
        outline: none;
    }

.text-primary {
    color: var(--primary-accent) !important;
}

.bg-white {
    background: var(--surface) !important;
}

.btn-white {
    background: var(--surface);
    border-color: var(--on-primary);
}

    .btn-white:hover, .btn-white:focus, .btn-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
    }

.btn-outline-white {
    background: transparent;
    border-color: var(--on-primary);
    color: var(--on-primary);
}

    .btn-outline-white:hover, .btn-outline-white:focus, .btn-outline-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
        box-shadow: none;
        outline: none;
    }

.text-white {
    color: var(--on-primary) !important;
}

.bg-black {
    background: var(--black) !important;
}

.btn-black {
    background: var(--black);
    border-color: var(--black);
}

    .btn-black:hover, .btn-black:focus, .btn-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
    }

.btn-outline-black {
    background: transparent;
    border-color: var(--black);
    color: var(--text);
}

    .btn-outline-black:hover, .btn-outline-black:focus, .btn-outline-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
        box-shadow: none;
        outline: none;
    }

.text-black {
    color: var(--text) !important;
}

.bg-secondary {
    background: var(--text-muted) !important;
}

.btn-secondary {
    background: var(--text-muted);
    border-color: var(--text-muted);
}

    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
    }

.btn-outline-secondary {
    background: transparent;
    border-color: var(--text-muted);
    color: var(--text-muted);
}

    .btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
        box-shadow: none;
        outline: none;
    }

.text-secondary {
    color: var(--text-muted) !important;
}

.bg-light-primary {
    background: var(--light-primary) !important;
}

.btn-light-primary {
    background: var(--light-primary);
    border-color: var(--light-primary);
}

    .btn-light-primary:hover, .btn-light-primary:focus, .btn-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
    }

.btn-outline-light-primary {
    background: transparent;
    border-color: var(--light-primary);
    color: var(--light-primary);
}

    .btn-outline-light-primary:hover, .btn-outline-light-primary:focus, .btn-outline-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
        box-shadow: none;
        outline: none;
    }

.text-light-primary {
    color: var(--light-primary) !important;
}

.bg-light-bg {
    background: var(--light-bg) !important;
}

.btn-light-bg {
    background: var(--light-bg);
    border-color: var(--light-bg);
}

    .btn-light-bg:hover, .btn-light-bg:focus, .btn-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
    }

.btn-outline-light-bg {
    background: transparent;
    border-color: var(--light-bg);
    color: var(--light-bg);
}

    .btn-outline-light-bg:hover, .btn-outline-light-bg:focus, .btn-outline-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
        box-shadow: none;
        outline: none;
    }

.text-light-bg {
    color: var(--light-bg) !important;
}

.bg-grey {
    background: var(--grey) !important;
}

.btn-grey {
    background: var(--grey);
    border-color: var(--grey);
}

    .btn-grey:hover, .btn-grey:focus, .btn-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
    }

.btn-outline-grey {
    background: transparent;
    border-color: var(--grey);
    color: var(--grey);
}

    .btn-outline-grey:hover, .btn-outline-grey:focus, .btn-outline-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
        box-shadow: none;
        outline: none;
    }

.text-grey {
    color: var(--grey) !important;
}

.bg-purple {
    background: var(--purple) !important;
}

.btn-purple {
    background: var(--purple);
    border-color: var(--purple);
}

    .btn-purple:hover, .btn-purple:focus, .btn-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
    }

.btn-outline-purple {
    background: transparent;
    border-color: var(--purple);
    color: var(--purple);
}

    .btn-outline-purple:hover, .btn-outline-purple:focus, .btn-outline-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
        box-shadow: none;
        outline: none;
    }

.text-purple {
    color: var(--purple) !important;
}

.bg-dark-purple {
    background: var(--dark-purple) !important;
}

.btn-dark-purple {
    background: var(--dark-purple);
    border-color: var(--dark-purple);
}

    .btn-dark-purple:hover, .btn-dark-purple:focus, .btn-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
    }

.btn-outline-dark-purple {
    background: transparent;
    border-color: var(--dark-purple);
    color: var(--dark-purple);
}

    .btn-outline-dark-purple:hover, .btn-outline-dark-purple:focus, .btn-outline-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
        box-shadow: none;
        outline: none;
    }

.text-dark-purple {
    color: var(--dark-purple) !important;
}

.bg-violet {
    background: var(--violet) !important;
}

.btn-violet {
    background: var(--violet);
    border-color: var(--violet);
}

    .btn-violet:hover, .btn-violet:focus, .btn-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
    }

.btn-outline-violet {
    background: transparent;
    border-color: var(--violet);
    color: var(--primary-accent);
}

    .btn-outline-violet:hover, .btn-outline-violet:focus, .btn-outline-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
        box-shadow: none;
        outline: none;
    }

.text-violet {
    color: var(--primary-accent) !important;
}

.bg-dark-grey {
    background: var(--dark-grey) !important;
}

.btn-dark-grey {
    background: var(--dark-grey);
    border-color: var(--dark-grey);
}

    .btn-dark-grey:hover, .btn-dark-grey:focus, .btn-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
    }

.btn-outline-dark-grey {
    background: transparent;
    border-color: var(--dark-grey);
    color: var(--dark-grey);
}

    .btn-outline-dark-grey:hover, .btn-outline-dark-grey:focus, .btn-outline-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
        box-shadow: none;
        outline: none;
    }

.text-dark-grey {
    color: var(--dark-grey) !important;
}

.bg-light-black {
    background: var(--light-black) !important;
}

.btn-light-black {
    background: var(--light-black);
    border-color: var(--light-black);
}

    .btn-light-black:hover, .btn-light-black:focus, .btn-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
    }

.btn-outline-light-black {
    background: transparent;
    border-color: var(--light-black);
    color: var(--light-black);
}

    .btn-outline-light-black:hover, .btn-outline-light-black:focus, .btn-outline-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
        box-shadow: none;
        outline: none;
    }

.text-light-black {
    color: var(--light-black) !important;
}

.bg-border-color {
    background: var(--border-color) !important;
}

.btn-border-color {
    background: var(--border-color);
    border-color: var(--border-color);
}

    .btn-border-color:hover, .btn-border-color:focus, .btn-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
    }

.btn-outline-border-color {
    background: transparent;
    border-color: var(--border-color);
    color: var(--border-color);
}

    .btn-outline-border-color:hover, .btn-outline-border-color:focus, .btn-outline-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
        box-shadow: none;
        outline: none;
    }

.text-border-color {
    color: var(--border-color) !important;
}

.bg-grey1 {
    background: var(--grey1) !important;
}

.btn-grey1 {
    background: var(--grey1);
    border-color: var(--grey1);
}

    .btn-grey1:hover, .btn-grey1:focus, .btn-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
    }

.btn-outline-grey1 {
    background: transparent;
    border-color: var(--grey1);
    color: var(--grey1);
}

    .btn-outline-grey1:hover, .btn-outline-grey1:focus, .btn-outline-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
        box-shadow: none;
        outline: none;
    }

.text-grey1 {
    color: var(--grey1) !important;
}

.bg-grey2 {
    background: var(--grey2) !important;
}

.btn-grey2 {
    background: var(--grey2);
    border-color: var(--grey2);
}

    .btn-grey2:hover, .btn-grey2:focus, .btn-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
    }

.btn-outline-grey2 {
    background: transparent;
    border-color: var(--grey2);
    color: var(--grey2);
}

    .btn-outline-grey2:hover, .btn-outline-grey2:focus, .btn-outline-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
        box-shadow: none;
        outline: none;
    }

.text-grey2 {
    color: var(--grey2) !important;
}

.bg-gray-color {
    background: var(--gray-color) !important;
}

.btn-gray-color {
    background: var(--gray-color);
    border-color: var(--gray-color);
}

    .btn-gray-color:hover, .btn-gray-color:focus, .btn-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
    }

.btn-outline-gray-color {
    background: transparent;
    border-color: var(--gray-color);
    color: var(--gray-color);
}

    .btn-outline-gray-color:hover, .btn-outline-gray-color:focus, .btn-outline-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
        box-shadow: none;
        outline: none;
    }

.text-gray-color {
    color: var(--gray-color) !important;
}

.bg-gray3 {
    background: var(--gray3) !important;
}

.btn-gray3 {
    background: var(--gray3);
    border-color: var(--gray3);
}

    .btn-gray3:hover, .btn-gray3:focus, .btn-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
    }

.btn-outline-gray3 {
    background: transparent;
    border-color: var(--gray3);
    color: var(--gray3);
}

    .btn-outline-gray3:hover, .btn-outline-gray3:focus, .btn-outline-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
        box-shadow: none;
        outline: none;
    }

.text-gray3 {
    color: var(--gray3) !important;
}

.bg-light-grey {
    background: var(--light-grey) !important;
}

.btn-light-grey {
    background: var(--light-grey);
    border-color: var(--light-grey);
}

    .btn-light-grey:hover, .btn-light-grey:focus, .btn-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
    }

.btn-outline-light-grey {
    background: transparent;
    border-color: var(--light-grey);
    color: var(--light-grey);
}

    .btn-outline-light-grey:hover, .btn-outline-light-grey:focus, .btn-outline-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
        box-shadow: none;
        outline: none;
    }

.text-light-grey {
    color: var(--light-grey) !important;
}

.fs-56 {
    font-size: clamp(30px, 30px + 0vw, 30px);
}

@media (min-width: 768px) {
    .fs-56 {
        font-size: clamp(30px, 30px + 0vw, 30px);
    }
}

@media (min-width: 1200px) {
    .fs-56 {
        font-size: clamp(30px, -13.3333333333px + 3.6111111111vw, 56px);
    }
}

.fs-40 {
    font-size: clamp(18px, 13.7142857143px + 1.3392857143vw, 24px);
}

@media (min-width: 768px) {
    .fs-40 {
        font-size: clamp(24px, 24px + 0vw, 24px);
    }
}

@media (min-width: 1200px) {
    .fs-40 {
        font-size: clamp(24px, -2.6666666667px + 2.2222222222vw, 40px);
    }
}

.fs-38 {
    font-size: clamp(18px, 15.1428571429px + 0.8928571429vw, 22px);
}

@media (min-width: 768px) {
    .fs-38 {
        font-size: clamp(22px, 22px + 0vw, 22px);
    }
}

@media (min-width: 1200px) {
    .fs-38 {
        font-size: clamp(22px, -4.6666666667px + 2.2222222222vw, 38px);
    }
}

.fs-32 {
    font-size: clamp(18px, 16.5714285714px + 0.4464285714vw, 20px);
}

@media (min-width: 768px) {
    .fs-32 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .fs-32 {
        font-size: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.fs-28 {
    font-size: clamp(16px, 14.5714285714px + 0.4464285714vw, 18px);
}

@media (min-width: 768px) {
    .fs-28 {
        font-size: clamp(18px, 18px + 0vw, 18px);
    }
}

@media (min-width: 1200px) {
    .fs-28 {
        font-size: clamp(18px, 1.3333333333px + 1.3888888889vw, 28px);
    }
}

.fs-24 {
    font-size: clamp(16px, 16px + 0vw, 16px);
}

@media (min-width: 768px) {
    .fs-24 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-24 {
        font-size: clamp(16px, 2.6666666667px + 1.1111111111vw, 24px);
    }
}

.fs-22 {
    font-size: clamp(14px, 12.5714285714px + 0.4464285714vw, 16px);
}

@media (min-width: 768px) {
    .fs-22 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-22 {
        font-size: clamp(16px, 6px + 0.8333333333vw, 22px);
    }
}

.fs-20 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-20 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-20 {
        font-size: clamp(12px, -1.3333333333px + 1.1111111111vw, 20px);
    }
}

.fs-18 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-18 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-18 {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

.fs-16 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-16 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-16 {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

.fs-15 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-15 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-15 {
        font-size: clamp(12px, 7px + 0.4166666667vw, 15px);
    }
}

.fs-14 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-14 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-14 {
        font-size: clamp(10px, 3.3333333333px + 0.5555555556vw, 14px);
    }
}

.fs-12 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-12 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-12 {
        font-size: clamp(10px, 6.6666666667px + 0.2777777778vw, 12px);
    }
}

.section-title {
    text-align: start;
}

@media (max-width: 767.98px) {
    .section-title {
        margin-bottom: 24px !important;
    }
}

@media (max-width: 991.98px) {
    .section-title {
        padding-inline: 0 !important;
    }
}

.sub-title {
    text-transform: none;
    text-align: start;
    color: var(--text-muted);
}

.breadcrumb-menu {
    background-color: var(--surface-2);
    border: 1px solid var(--border-color);
    padding: 18px 0;
}

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
        content: var(--bs-breadcrumb-divider, ">");
        color: var(--purple);
        float: inline-start !important;
        padding-inline-end: var(--bs-breadcrumb-item-padding-x) !important;
    }

    .breadcrumb-menu nav .breadcrumb .breadcrumb-item a {
        font-weight: 400;
        font-size: 16px;
        line-height: 19px;
        letter-spacing: -0.18px;
        color: var(--text-muted);
    }

        .breadcrumb-menu nav .breadcrumb .breadcrumb-item a.active {
            color: var(--purple);
        }

.financial-lists .col .financial-card {
    background: radial-gradient(75% 75% at 90% 15%, rgba(244, 243, 255, 0.55) 21%, rgba(244, 243, 255, 0.2) 54%, rgba(244, 243, 255, 0) 100%), var(--surface);
    border-radius: 12px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.02);
    border: 1px solid var(--border);
    padding: 24px;
    height: 100%;
    display: flex;
    flex-direction: column;
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .financial-lists .col .financial-card {
        padding: 24px;
    }
}

@media (max-width: 991.98px) {
    .financial-lists .col .financial-card {
        padding: 20px;
    }
}

@media (max-width: 767.98px) {
    .financial-lists .col .financial-card {
        padding: 20px;
    }
}

@media (max-width: 575.98px) {
    .financial-lists .col .financial-card {
        padding: 18px;
    }
}

.financial-lists .col .financial-card-icon {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background: linear-gradient(to left, var(--surface-3) 0%, #d4cce8 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-block-end: 24px;
    align-self: flex-start;
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .financial-lists .col .financial-card-icon {
        width: 60px;
        height: 60px;
        margin-block-end: 20px;
    }
}

@media (max-width: 991.98px) {
    .financial-lists .col .financial-card-icon {
        width: 60px;
        height: 60px;
        margin-block-end: 20px;
    }
}

.financial-lists .col .financial-card-icon svg,
.financial-lists .col .financial-card-icon i {
    color: #7d64b5;
    font-size: 32px;
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .financial-lists .col .financial-card-icon svg,
    .financial-lists .col .financial-card-icon i {
        font-size: 28px;
    }
}

@media (max-width: 991.98px) {
    .financial-lists .col .financial-card-icon svg,
    .financial-lists .col .financial-card-icon i {
        font-size: 28px;
    }
}

.financial-lists .col .financial-card-icon img {
    width: 40px;
    height: 40px;
    object-fit: contain;
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .financial-lists .col .financial-card-icon img {
        width: 35px;
        height: 35px;
    }
}

@media (max-width: 991.98px) {
    .financial-lists .col .financial-card-icon img {
        width: 35px;
        height: 35px;
    }
}

.financial-lists .col .financial-card-title {
    font-size: 24px;
    font-weight: 700;
    color: var(--text-muted);
    margin-block-end: 16px;
    line-height: 1.3;
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .financial-lists .col .financial-card-title {
        font-size: 22px;
        margin-block-end: 14px;
    }
}

@media (max-width: 991.98px) {
    .financial-lists .col .financial-card-title {
        font-size: 20px;
        margin-block-end: 14px;
    }
}

@media (max-width: 767.98px) {
    .financial-lists .col .financial-card-title {
        font-size: 18px;
        margin-block-end: 12px;
    }
}

@media (max-width: 575.98px) {
    .financial-lists .col .financial-card-title {
        font-size: 16px;
        margin-block-end: 10px;
    }
}

.financial-lists .col .financial-card-description {
    font-size: 20px;
    font-weight: 400;
    color: var(--text-muted);
    line-height: 1.4;
    margin-block-end: 24px;
    flex-grow: 1;
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .financial-lists .col .financial-card-description {
        font-size: 18px;
        margin-block-end: 20px;
    }
}

@media (max-width: 1560px) and (min-width: 1200px) {
    .financial-lists .col .financial-card-description {
        font-size: 18px;
    }
}

@media (max-width: 991.98px) {
    .financial-lists .col .financial-card-description {
        font-size: 18px;
        margin-block-end: 20px;
    }
}

@media (max-width: 767.98px) {
    .financial-lists .col .financial-card-description {
        font-size: 14px;
        margin-block-end: 18px;
    }
}

@media (max-width: 575.98px) {
    .financial-lists .col .financial-card-description {
        font-size: 13px;
        margin-block-end: 16px;
        line-height: 1.5;
    }
}

.financial-lists .col .financial-card-description p {
    font-size: inherit;
    margin-block-end: 20px;
    line-height: inherit;
}

@media (max-width: 991.98px) {
    .financial-lists .col .financial-card-description p {
        margin-block-end: 18px;
    }
}

@media (max-width: 767.98px) {
    .financial-lists .col .financial-card-description p {
        margin-block-end: 16px;
    }
}

@media (max-width: 575.98px) {
    .financial-lists .col .financial-card-description p {
        margin-block-end: 14px;
    }
}

.financial-lists .col .financial-card-description p:last-child {
    margin-block-end: 0;
}

.financial-lists .col .financial-card-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

@media (max-width: 767.98px) {
    .financial-lists .col .financial-card-actions {
        gap: 10px;
    }
}

.financial-lists .col .financial-card-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    padding: 12px 20px;
    background: var(--surface);
    border: 1px solid var(--secondary);
    border-radius: 9999px;
    color: var(--primary-hover);
    font-size: 16px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.3s ease;
    width: 100%;
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .financial-lists .col .financial-card-actions a {
        padding: 10px 18px;
        font-size: 15px;
    }
}

@media (max-width: 991.98px) {
    .financial-lists .col .financial-card-actions a {
        padding: 10px 18px;
        font-size: 15px;
    }
}

@media (max-width: 767.98px) {
    .financial-lists .col .financial-card-actions a {
        padding: 10px 16px;
        font-size: 14px;
    }
}

@media (max-width: 575.98px) {
    .financial-lists .col .financial-card-actions a {
        padding: 10px 14px;
        font-size: 13px;
    }
}

.financial-lists .col .financial-card-actions a i,
.financial-lists .col .financial-card-actions a svg {
    margin-inline-start: 8px;
    font-size: 16px;
    transition: transform 0.3s ease;
    color: var(--primary-hover);
    flex-shrink: 0;
}

.financial-lists .col .financial-card-actions a img {
    margin-inline-start: 8px;
    width: 16px;
    height: 16px;
    transition: filter 0.3s ease;
    filter: brightness(0) saturate(100%) invert(25%) sepia(15%) saturate(2000%) hue-rotate(240deg) brightness(0.9);
    flex-shrink: 0;
    object-fit: contain;
}

.financial-lists .col .financial-card-actions a:hover {
    border-color: var(--primary);
    background: var(--primary);
    color: var(--on-primary);
}

    .financial-lists .col .financial-card-actions a:hover i,
    .financial-lists .col .financial-card-actions a:hover svg {
        color: var(--on-primary);
    }

    .financial-lists .col .financial-card-actions a:hover img {
        filter: brightness(0) invert(1);
    }

.financial-lists .col .financial-card-actions a:active {
    transform: scale(0.98);
}

.financial-partners {
    overflow: hidden;
}

    .financial-partners .container-lg {
        overflow: visible;
    }

.financial-partners__title {
    font-size: 32px;
    font-weight: 700;
    color: var(--primary-accent);
    margin-block-end: 32px;
    line-height: 1.2;
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .financial-partners__title {
        font-size: 28px;
        margin-block-end: 28px;
    }
}

@media (max-width: 991.98px) {
    .financial-partners__title {
        font-size: 26px;
        margin-block-end: 24px;
    }
}

@media (max-width: 767.98px) {
    .financial-partners__title {
        font-size: 24px;
        margin-block-end: 20px;
    }
}

@media (max-width: 575.98px) {
    .financial-partners__title {
        font-size: 22px;
        margin-block-end: 18px;
    }
}

.financial-partners-marquee {
    overflow: hidden;
    position: relative;
    mask-image: linear-gradient(to right, transparent, black 5%, black 95%, transparent);
    -webkit-mask-image: linear-gradient(to right, transparent, black 5%, black 95%, transparent);
}

.financial-partners-marquee__track {
    display: flex;
    width: max-content;
    animation: marqueeScroll 25s linear infinite;
}

.financial-partners-marquee:hover .financial-partners-marquee__track {
    animation-play-state: paused;
}

@keyframes marqueeScroll {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}

.financial-partners-marquee__item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 32px;
    height: 56px;
    flex-shrink: 0;
    filter: invert(1);
}

    .financial-partners-marquee__item img {
        width: 140px;
        height: 48px;
        object-fit: contain;
        filter: grayscale(100%);
        opacity: 0.85;
        transition: 0.3s;
    }

    .financial-partners-marquee__item:hover img {
        filter: grayscale(0%);
        opacity: 1;
    }

/*!
* Style Sheet for ""
* version: 1
* last modified:2023 By Applab
* author: Applab
* website: www.applab.qa
*/
.alert-primary {
    --bs-alert-color: var(--bs-primary-text);
    --bs-alert-bg: var(--bs-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-primary-border-subtle);
    --bs-alert-link-color: var(--bs-primary-text);
}

.alert-white {
    --bs-alert-color: var(--bs-white-text);
    --bs-alert-bg: var(--bs-white-bg-subtle);
    --bs-alert-border-color: var(--bs-white-border-subtle);
    --bs-alert-link-color: var(--bs-white-text);
}

.alert-black {
    --bs-alert-color: var(--bs-black-text);
    --bs-alert-bg: var(--bs-black-bg-subtle);
    --bs-alert-border-color: var(--bs-black-border-subtle);
    --bs-alert-link-color: var(--bs-black-text);
}

.alert-secondary {
    --bs-alert-color: var(--bs-secondary-text);
    --bs-alert-bg: var(--bs-secondary-bg-subtle);
    --bs-alert-border-color: var(--bs-secondary-border-subtle);
    --bs-alert-link-color: var(--bs-secondary-text);
}

.alert-light-primary {
    --bs-alert-color: var(--bs-light-primary-text);
    --bs-alert-bg: var(--bs-light-primary-bg-subtle);
    --bs-alert-border-color: var(--bs-light-primary-border-subtle);
    --bs-alert-link-color: var(--bs-light-primary-text);
}

.alert-light-bg {
    --bs-alert-color: var(--bs-light-bg-text);
    --bs-alert-bg: var(--bs-light-bg-bg-subtle);
    --bs-alert-border-color: var(--bs-light-bg-border-subtle);
    --bs-alert-link-color: var(--bs-light-bg-text);
}

.alert-grey {
    --bs-alert-color: var(--bs-grey-text);
    --bs-alert-bg: var(--bs-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-grey-border-subtle);
    --bs-alert-link-color: var(--bs-grey-text);
}

.alert-purple {
    --bs-alert-color: var(--bs-purple-text);
    --bs-alert-bg: var(--bs-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-purple-border-subtle);
    --bs-alert-link-color: var(--bs-purple-text);
}

.alert-dark-purple {
    --bs-alert-color: var(--bs-dark-purple-text);
    --bs-alert-bg: var(--bs-dark-purple-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-purple-border-subtle);
    --bs-alert-link-color: var(--bs-dark-purple-text);
}

.alert-violet {
    --bs-alert-color: var(--bs-violet-text);
    --bs-alert-bg: var(--bs-violet-bg-subtle);
    --bs-alert-border-color: var(--bs-violet-border-subtle);
    --bs-alert-link-color: var(--bs-violet-text);
}

.alert-dark-grey {
    --bs-alert-color: var(--bs-dark-grey-text);
    --bs-alert-bg: var(--bs-dark-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-dark-grey-border-subtle);
    --bs-alert-link-color: var(--bs-dark-grey-text);
}

.alert-light-black {
    --bs-alert-color: var(--bs-light-black-text);
    --bs-alert-bg: var(--bs-light-black-bg-subtle);
    --bs-alert-border-color: var(--bs-light-black-border-subtle);
    --bs-alert-link-color: var(--bs-light-black-text);
}

.alert-border-color {
    --bs-alert-color: var(--bs-border-color-text);
    --bs-alert-bg: var(--bs-border-color-bg-subtle);
    --bs-alert-border-color: var(--bs-border-color-border-subtle);
    --bs-alert-link-color: var(--bs-border-color-text);
}

.alert-grey1 {
    --bs-alert-color: var(--bs-grey1-text);
    --bs-alert-bg: var(--bs-grey1-bg-subtle);
    --bs-alert-border-color: var(--bs-grey1-border-subtle);
    --bs-alert-link-color: var(--bs-grey1-text);
}

.alert-grey2 {
    --bs-alert-color: var(--bs-grey2-text);
    --bs-alert-bg: var(--bs-grey2-bg-subtle);
    --bs-alert-border-color: var(--bs-grey2-border-subtle);
    --bs-alert-link-color: var(--bs-grey2-text);
}

.alert-gray-color {
    --bs-alert-color: var(--bs-gray-color-text);
    --bs-alert-bg: var(--bs-gray-color-bg-subtle);
    --bs-alert-border-color: var(--bs-gray-color-border-subtle);
    --bs-alert-link-color: var(--bs-gray-color-text);
}

.alert-gray3 {
    --bs-alert-color: var(--bs-gray3-text);
    --bs-alert-bg: var(--bs-gray3-bg-subtle);
    --bs-alert-border-color: var(--bs-gray3-border-subtle);
    --bs-alert-link-color: var(--bs-gray3-text);
}

.alert-light-grey {
    --bs-alert-color: var(--bs-light-grey-text);
    --bs-alert-bg: var(--bs-light-grey-bg-subtle);
    --bs-alert-border-color: var(--bs-light-grey-border-subtle);
    --bs-alert-link-color: var(--bs-light-grey-text);
}

.bg-primary {
    background: var(--primary) !important;
}

.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
    }

.btn-outline-primary {
    background: transparent;
    border-color: var(--primary);
    color: var(--primary-accent);
}

    .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active {
        background: color-mix(in srgb, var(--primary) 80%, transparent);
        border-color: var(--primary);
        box-shadow: none;
        outline: none;
    }

.text-primary {
    color: var(--primary-accent) !important;
}

.bg-white {
    background: var(--surface) !important;
}

.btn-white {
    background: var(--surface);
    border-color: var(--on-primary);
}

    .btn-white:hover, .btn-white:focus, .btn-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
    }

.btn-outline-white {
    background: transparent;
    border-color: var(--on-primary);
    color: var(--on-primary);
}

    .btn-outline-white:hover, .btn-outline-white:focus, .btn-outline-white:active {
        background: color-mix(in srgb, var(--surface) 80%, transparent);
        border-color: var(--on-primary);
        box-shadow: none;
        outline: none;
    }

.text-white {
    color: var(--on-primary) !important;
}

.bg-black {
    background: var(--black) !important;
}

.btn-black {
    background: var(--black);
    border-color: var(--black);
}

    .btn-black:hover, .btn-black:focus, .btn-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
    }

.btn-outline-black {
    background: transparent;
    border-color: var(--black);
    color: var(--text);
}

    .btn-outline-black:hover, .btn-outline-black:focus, .btn-outline-black:active {
        background: color-mix(in srgb, var(--black) 80%, transparent);
        border-color: var(--black);
        box-shadow: none;
        outline: none;
    }

.text-black {
    color: var(--text) !important;
}

.bg-secondary {
    background: var(--text-muted) !important;
}

.btn-secondary {
    background: var(--text-muted);
    border-color: var(--text-muted);
}

    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
    }

.btn-outline-secondary {
    background: transparent;
    border-color: var(--text-muted);
    color: var(--text-muted);
}

    .btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active {
        background: color-mix(in srgb, var(--text-muted) 80%, transparent);
        border-color: var(--text-muted);
        box-shadow: none;
        outline: none;
    }

.text-secondary {
    color: var(--text-muted) !important;
}

.bg-light-primary {
    background: var(--light-primary) !important;
}

.btn-light-primary {
    background: var(--light-primary);
    border-color: var(--light-primary);
}

    .btn-light-primary:hover, .btn-light-primary:focus, .btn-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
    }

.btn-outline-light-primary {
    background: transparent;
    border-color: var(--light-primary);
    color: var(--light-primary);
}

    .btn-outline-light-primary:hover, .btn-outline-light-primary:focus, .btn-outline-light-primary:active {
        background: color-mix(in srgb, var(--light-primary) 80%, transparent);
        border-color: var(--light-primary);
        box-shadow: none;
        outline: none;
    }

.text-light-primary {
    color: var(--light-primary) !important;
}

.bg-light-bg {
    background: var(--light-bg) !important;
}

.btn-light-bg {
    background: var(--light-bg);
    border-color: var(--light-bg);
}

    .btn-light-bg:hover, .btn-light-bg:focus, .btn-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
    }

.btn-outline-light-bg {
    background: transparent;
    border-color: var(--light-bg);
    color: var(--light-bg);
}

    .btn-outline-light-bg:hover, .btn-outline-light-bg:focus, .btn-outline-light-bg:active {
        background: color-mix(in srgb, var(--light-bg) 80%, transparent);
        border-color: var(--light-bg);
        box-shadow: none;
        outline: none;
    }

.text-light-bg {
    color: var(--light-bg) !important;
}

.bg-grey {
    background: var(--grey) !important;
}

.btn-grey {
    background: var(--grey);
    border-color: var(--grey);
}

    .btn-grey:hover, .btn-grey:focus, .btn-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
    }

.btn-outline-grey {
    background: transparent;
    border-color: var(--grey);
    color: var(--grey);
}

    .btn-outline-grey:hover, .btn-outline-grey:focus, .btn-outline-grey:active {
        background: color-mix(in srgb, var(--grey) 80%, transparent);
        border-color: var(--grey);
        box-shadow: none;
        outline: none;
    }

.text-grey {
    color: var(--grey) !important;
}

.bg-purple {
    background: var(--purple) !important;
}

.btn-purple {
    background: var(--purple);
    border-color: var(--purple);
}

    .btn-purple:hover, .btn-purple:focus, .btn-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
    }

.btn-outline-purple {
    background: transparent;
    border-color: var(--purple);
    color: var(--purple);
}

    .btn-outline-purple:hover, .btn-outline-purple:focus, .btn-outline-purple:active {
        background: color-mix(in srgb, var(--purple) 80%, transparent);
        border-color: var(--purple);
        box-shadow: none;
        outline: none;
    }

.text-purple {
    color: var(--purple) !important;
}

.bg-dark-purple {
    background: var(--dark-purple) !important;
}

.btn-dark-purple {
    background: var(--dark-purple);
    border-color: var(--dark-purple);
}

    .btn-dark-purple:hover, .btn-dark-purple:focus, .btn-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
    }

.btn-outline-dark-purple {
    background: transparent;
    border-color: var(--dark-purple);
    color: var(--dark-purple);
}

    .btn-outline-dark-purple:hover, .btn-outline-dark-purple:focus, .btn-outline-dark-purple:active {
        background: color-mix(in srgb, var(--dark-purple) 80%, transparent);
        border-color: var(--dark-purple);
        box-shadow: none;
        outline: none;
    }

.text-dark-purple {
    color: var(--dark-purple) !important;
}

.bg-violet {
    background: var(--violet) !important;
}

.btn-violet {
    background: var(--violet);
    border-color: var(--violet);
}

    .btn-violet:hover, .btn-violet:focus, .btn-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
    }

.btn-outline-violet {
    background: transparent;
    border-color: var(--violet);
    color: var(--primary-accent);
}

    .btn-outline-violet:hover, .btn-outline-violet:focus, .btn-outline-violet:active {
        background: color-mix(in srgb, var(--violet) 80%, transparent);
        border-color: var(--violet);
        box-shadow: none;
        outline: none;
    }

.text-violet {
    color: var(--primary-accent) !important;
}

.bg-dark-grey {
    background: var(--dark-grey) !important;
}

.btn-dark-grey {
    background: var(--dark-grey);
    border-color: var(--dark-grey);
}

    .btn-dark-grey:hover, .btn-dark-grey:focus, .btn-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
    }

.btn-outline-dark-grey {
    background: transparent;
    border-color: var(--dark-grey);
    color: var(--dark-grey);
}

    .btn-outline-dark-grey:hover, .btn-outline-dark-grey:focus, .btn-outline-dark-grey:active {
        background: color-mix(in srgb, var(--dark-grey) 80%, transparent);
        border-color: var(--dark-grey);
        box-shadow: none;
        outline: none;
    }

.text-dark-grey {
    color: var(--dark-grey) !important;
}

.bg-light-black {
    background: var(--light-black) !important;
}

.btn-light-black {
    background: var(--light-black);
    border-color: var(--light-black);
}

    .btn-light-black:hover, .btn-light-black:focus, .btn-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
    }

.btn-outline-light-black {
    background: transparent;
    border-color: var(--light-black);
    color: var(--light-black);
}

    .btn-outline-light-black:hover, .btn-outline-light-black:focus, .btn-outline-light-black:active {
        background: color-mix(in srgb, var(--light-black) 80%, transparent);
        border-color: var(--light-black);
        box-shadow: none;
        outline: none;
    }

.text-light-black {
    color: var(--light-black) !important;
}

.bg-border-color {
    background: var(--border-color) !important;
}

.btn-border-color {
    background: var(--border-color);
    border-color: var(--border-color);
}

    .btn-border-color:hover, .btn-border-color:focus, .btn-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
    }

.btn-outline-border-color {
    background: transparent;
    border-color: var(--border-color);
    color: var(--border-color);
}

    .btn-outline-border-color:hover, .btn-outline-border-color:focus, .btn-outline-border-color:active {
        background: color-mix(in srgb, var(--border-color) 80%, transparent);
        border-color: var(--border-color);
        box-shadow: none;
        outline: none;
    }

.text-border-color {
    color: var(--border-color) !important;
}

.bg-grey1 {
    background: var(--grey1) !important;
}

.btn-grey1 {
    background: var(--grey1);
    border-color: var(--grey1);
}

    .btn-grey1:hover, .btn-grey1:focus, .btn-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
    }

.btn-outline-grey1 {
    background: transparent;
    border-color: var(--grey1);
    color: var(--grey1);
}

    .btn-outline-grey1:hover, .btn-outline-grey1:focus, .btn-outline-grey1:active {
        background: color-mix(in srgb, var(--grey1) 80%, transparent);
        border-color: var(--grey1);
        box-shadow: none;
        outline: none;
    }

.text-grey1 {
    color: var(--grey1) !important;
}

.bg-grey2 {
    background: var(--grey2) !important;
}

.btn-grey2 {
    background: var(--grey2);
    border-color: var(--grey2);
}

    .btn-grey2:hover, .btn-grey2:focus, .btn-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
    }

.btn-outline-grey2 {
    background: transparent;
    border-color: var(--grey2);
    color: var(--grey2);
}

    .btn-outline-grey2:hover, .btn-outline-grey2:focus, .btn-outline-grey2:active {
        background: color-mix(in srgb, var(--grey2) 80%, transparent);
        border-color: var(--grey2);
        box-shadow: none;
        outline: none;
    }

.text-grey2 {
    color: var(--grey2) !important;
}

.bg-gray-color {
    background: var(--gray-color) !important;
}

.btn-gray-color {
    background: var(--gray-color);
    border-color: var(--gray-color);
}

    .btn-gray-color:hover, .btn-gray-color:focus, .btn-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
    }

.btn-outline-gray-color {
    background: transparent;
    border-color: var(--gray-color);
    color: var(--gray-color);
}

    .btn-outline-gray-color:hover, .btn-outline-gray-color:focus, .btn-outline-gray-color:active {
        background: color-mix(in srgb, var(--gray-color) 80%, transparent);
        border-color: var(--gray-color);
        box-shadow: none;
        outline: none;
    }

.text-gray-color {
    color: var(--gray-color) !important;
}

.bg-gray3 {
    background: var(--gray3) !important;
}

.btn-gray3 {
    background: var(--gray3);
    border-color: var(--gray3);
}

    .btn-gray3:hover, .btn-gray3:focus, .btn-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
    }

.btn-outline-gray3 {
    background: transparent;
    border-color: var(--gray3);
    color: var(--gray3);
}

    .btn-outline-gray3:hover, .btn-outline-gray3:focus, .btn-outline-gray3:active {
        background: color-mix(in srgb, var(--gray3) 80%, transparent);
        border-color: var(--gray3);
        box-shadow: none;
        outline: none;
    }

.text-gray3 {
    color: var(--gray3) !important;
}

.bg-light-grey {
    background: var(--light-grey) !important;
}

.btn-light-grey {
    background: var(--light-grey);
    border-color: var(--light-grey);
}

    .btn-light-grey:hover, .btn-light-grey:focus, .btn-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
    }

.btn-outline-light-grey {
    background: transparent;
    border-color: var(--light-grey);
    color: var(--light-grey);
}

    .btn-outline-light-grey:hover, .btn-outline-light-grey:focus, .btn-outline-light-grey:active {
        background: color-mix(in srgb, var(--light-grey) 80%, transparent);
        border-color: var(--light-grey);
        box-shadow: none;
        outline: none;
    }

.text-light-grey {
    color: var(--light-grey) !important;
}

.fs-56 {
    font-size: clamp(30px, 30px + 0vw, 30px);
}

@media (min-width: 768px) {
    .fs-56 {
        font-size: clamp(30px, 30px + 0vw, 30px);
    }
}

@media (min-width: 1200px) {
    .fs-56 {
        font-size: clamp(30px, -13.3333333333px + 3.6111111111vw, 56px);
    }
}

.fs-40 {
    font-size: clamp(18px, 13.7142857143px + 1.3392857143vw, 24px);
}

@media (min-width: 768px) {
    .fs-40 {
        font-size: clamp(24px, 24px + 0vw, 24px);
    }
}

@media (min-width: 1200px) {
    .fs-40 {
        font-size: clamp(24px, -2.6666666667px + 2.2222222222vw, 40px);
    }
}

.fs-38 {
    font-size: clamp(18px, 15.1428571429px + 0.8928571429vw, 22px);
}

@media (min-width: 768px) {
    .fs-38 {
        font-size: clamp(22px, 22px + 0vw, 22px);
    }
}

@media (min-width: 1200px) {
    .fs-38 {
        font-size: clamp(22px, -4.6666666667px + 2.2222222222vw, 38px);
    }
}

.fs-32 {
    font-size: clamp(18px, 16.5714285714px + 0.4464285714vw, 20px);
}

@media (min-width: 768px) {
    .fs-32 {
        font-size: clamp(20px, 20px + 0vw, 20px);
    }
}

@media (min-width: 1200px) {
    .fs-32 {
        font-size: clamp(20px, 0px + 1.6666666667vw, 32px);
    }
}

.fs-28 {
    font-size: clamp(16px, 14.5714285714px + 0.4464285714vw, 18px);
}

@media (min-width: 768px) {
    .fs-28 {
        font-size: clamp(18px, 18px + 0vw, 18px);
    }
}

@media (min-width: 1200px) {
    .fs-28 {
        font-size: clamp(18px, 1.3333333333px + 1.3888888889vw, 28px);
    }
}

.fs-24 {
    font-size: clamp(16px, 16px + 0vw, 16px);
}

@media (min-width: 768px) {
    .fs-24 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-24 {
        font-size: clamp(16px, 2.6666666667px + 1.1111111111vw, 24px);
    }
}

.fs-22 {
    font-size: clamp(14px, 12.5714285714px + 0.4464285714vw, 16px);
}

@media (min-width: 768px) {
    .fs-22 {
        font-size: clamp(16px, 16px + 0vw, 16px);
    }
}

@media (min-width: 1200px) {
    .fs-22 {
        font-size: clamp(16px, 6px + 0.8333333333vw, 22px);
    }
}

.fs-20 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-20 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-20 {
        font-size: clamp(12px, -1.3333333333px + 1.1111111111vw, 20px);
    }
}

.fs-18 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-18 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-18 {
        font-size: clamp(12px, 2px + 0.8333333333vw, 18px);
    }
}

.fs-16 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-16 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-16 {
        font-size: clamp(12px, 5.3333333333px + 0.5555555556vw, 16px);
    }
}

.fs-15 {
    font-size: clamp(12px, 12px + 0vw, 12px);
}

@media (min-width: 768px) {
    .fs-15 {
        font-size: clamp(12px, 12px + 0vw, 12px);
    }
}

@media (min-width: 1200px) {
    .fs-15 {
        font-size: clamp(12px, 7px + 0.4166666667vw, 15px);
    }
}

.fs-14 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-14 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-14 {
        font-size: clamp(10px, 3.3333333333px + 0.5555555556vw, 14px);
    }
}

.fs-12 {
    font-size: clamp(10px, 10px + 0vw, 10px);
}

@media (min-width: 768px) {
    .fs-12 {
        font-size: clamp(10px, 10px + 0vw, 10px);
    }
}

@media (min-width: 1200px) {
    .fs-12 {
        font-size: clamp(10px, 6.6666666667px + 0.2777777778vw, 12px);
    }
}

.fsb-what-we-offer-section-inner {
    background-color: var(--surface);
    border-radius: 16px;
    padding: 48px;
}

    .fsb-what-we-offer-section-inner .section-heading .sub-title,
    .fsb-what-we-offer-section-inner .section-heading p {
        color: var(--text);
        margin-bottom: 0;
    }

    .fsb-what-we-offer-section-inner .section-heading .title,
    .fsb-what-we-offer-section-inner .section-heading h2 {
        color: var(--primary-accent);
        margin-bottom: 2rem;
    }

.fsb-what-we-offer-section-inner-col .heading,
.fsb-what-we-offer-section-inner-col h3 {
    color: var(--primary-accent);
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--secondary);
    margin-bottom: 1rem;
}

.fsb-what-we-offer-section-inner-col .sub-heading,
.fsb-what-we-offer-section-inner-col h4 {
    color: var(--primary-accent);
    margin-bottom: 0.5rem;
}

    .fsb-what-we-offer-section-inner-col .sub-heading span,
    .fsb-what-we-offer-section-inner-col h4 span {
        font-style: italic;
        display: block;
    }

.fsb-what-we-offer-section-inner-col ul {
    list-style-type: disc;
    padding-inline-start: 2rem;
    margin-bottom: 1rem;
}

    .fsb-what-we-offer-section-inner-col ul li {
        list-style-type: disc;
    }

        .fsb-what-we-offer-section-inner-col ul li p {
            margin-bottom: 5px;
        }

    .fsb-what-we-offer-section-inner-col ul:last-child {
        margin-bottom: 0;
    }

@media (max-width: 767.98px) {
    .fsb-what-we-offer-section-inner-col.second-item {
        margin-top: 2rem;
    }
}

.fsb-why-company-section .section-heading .title,
.fsb-why-company-section .section-heading h2 {
    color: var(--primary-accent);
    margin-bottom: 2.5rem;
}

.fsb-why-company-section-item {
    display: flex;
    /* icon stays at the top so it does not drift down the middle of long text */
    align-items: flex-start;
    justify-content: start;
    gap: 1.25rem;
    margin-bottom: 1rem;
}

    .fsb-why-company-section-item img {
        width: 40px;
        height: auto;
        flex-shrink: 0;
        aspect-ratio: 1/1;
        object-fit: contain;
        object-position: center center;
    }

@media (max-width: 991.98px) {
    .fsb-why-company-section-item img {
        width: 30px;
    }
}

.fsb-why-company-section-item p {
    margin-bottom: 0;
}

.fsb-setup-process-section-inner {
    background-color: var(--surface);
    border-radius: 16px;
    padding: 48px;
}

@media (max-width: 767.98px) {
    .fsb-setup-process-section-inner {
        padding: 20px;
    }
}

.fsb-setup-process-section-inner .section-heading .sub-title,
.fsb-setup-process-section-inner .section-heading p {
    color: var(--text);
    margin-bottom: 0;
}

.fsb-setup-process-section-inner .section-heading .title,
.fsb-setup-process-section-inner .section-heading h2 {
    color: var(--primary-accent);
    margin-bottom: 1rem;
}

.fsb-setup-process-section-inner .section-heading .desc {
    margin-bottom: 2rem;
}

.fsb-setup-process-section-inner .section-heading img {
    width: 100%;
    height: auto;
    border-radius: 16px;
}

.fsb-setup-process-section-inner #fsb-process-step {
    margin-top: 60px;
}

    .fsb-setup-process-section-inner #fsb-process-step.accordion {
        background-color: transparent;
        padding: 0;
        border-radius: 0;
    }

        .fsb-setup-process-section-inner #fsb-process-step.accordion .accordion-body .accordion-item {
            border-radius: 15px !important;
        }

        .fsb-setup-process-section-inner #fsb-process-step.accordion .accordion-item {
            border-bottom: 1px solid var(--border) !important;
            border-radius: 0 !important;
        }

            .fsb-setup-process-section-inner #fsb-process-step.accordion .accordion-item:last-child {
                border-bottom: none !important;
            }

            .fsb-setup-process-section-inner #fsb-process-step.accordion .accordion-item .accordion-button {
                font-weight: 500;
            }

                .fsb-setup-process-section-inner #fsb-process-step.accordion .accordion-item .accordion-button::after {
                    background-color: var(--surface);
                }

.fsb-additional-information-section .section-heading .title,
.fsb-additional-information-section .section-heading h2 {
    color: var(--primary-accent);
    margin-bottom: 2.5rem;
}

.fsb-additional-information-section-col h4,
.fsb-additional-information-section-col .title {
    margin-bottom: 1rem;
}

.fsb-additional-information-section-col p,
.fsb-additional-information-section-col .desc {
    margin-bottom: 1rem;
}

.fsb-additional-information-section-col a {
    color: var(--primary-accent);
    border-color: var(--secondary);
}

@media (max-width: 767.98px) {
    .fsb-additional-information-section-col.second-item {
        margin-top: 2rem;
    }
}

.fsb-relevant-information-section .section-heading .title,
.fsb-relevant-information-section .section-heading h2 {
    color: var(--primary-accent);
    margin-bottom: 2.5rem;
}

.fsb-relevant-information-section #fsb-relevant-info.accordion {
    background-color: transparent;
    padding: 0;
    border-radius: 0;
}

    .fsb-relevant-information-section #fsb-relevant-info.accordion .accordion-item {
        border-bottom: 1px solid var(--secondary) !important;
        border-radius: 0;
    }

        .fsb-relevant-information-section #fsb-relevant-info.accordion .accordion-item:last-child {
            border-bottom: 0 !important;
        }

        .fsb-relevant-information-section #fsb-relevant-info.accordion .accordion-item .accordion-button::after {
            background-color: var(--surface);
        }

        .fsb-relevant-information-section #fsb-relevant-info.accordion .accordion-item .desc {
            margin-bottom: 1.5rem;
        }

        .fsb-relevant-information-section #fsb-relevant-info.accordion .accordion-item .file-item {
            display: flex;
            width: fit-content;
            align-items: center;
            justify-content: start;
            gap: 8px;
            margin-bottom: 1.5rem;
            color: var(--primary-accent);
            font-weight: 500;
            text-decoration: none;
            border-bottom: 1.5px solid transparent;
            padding-bottom: 2px;
            transition: border-color 0.2s ease;
        }

            .fsb-relevant-information-section #fsb-relevant-info.accordion .accordion-item .file-item:hover {
                border-bottom-color: var(--violet);
            }

                .fsb-relevant-information-section #fsb-relevant-info.accordion .accordion-item .file-item:hover img:last-child {
                    transform: translateX(3px);
                    transition: transform 0.2s ease;
                }

        .fsb-relevant-information-section #fsb-relevant-info.accordion .accordion-item .question {
            margin-bottom: 5px;
        }

        .fsb-relevant-information-section #fsb-relevant-info.accordion .accordion-item .answer {
            margin-bottom: 1.5rem;
        }

.file-item:hover {
    color: var(--purple, var(--purple));
    border-bottom-color: var(--purple, var(--purple));
}


.fsb-setup-process-section-inner > .row {
    align-items: stretch;
}

    .fsb-setup-process-section-inner > .row > .col-lg-4 > .section-heading {
        position: sticky;
        top: 250px;
    }

@media (max-width: 991.98px) {
    .fsb-setup-process-section-inner > .row > .col-lg-4 > .section-heading {
        position: static;
    }
}

.space-component {
    height: var(--spacer-size);
}

@media (max-width: 991.98px) {
    .space-component {
        height: calc(var(--spacer-size) * 0.75);
    }
}

@media (max-width: 767.98px) {
    .space-component {
        height: calc(var(--spacer-size) * 0.5);
    }
}