html {
    scroll-behavior: smooth;
    scroll-padding-top: 80px;
}

body {
    font-family: 'Space Grotesk', sans-serif;
}


@keyframes scrollMarquee {
    0% {
        transform: translateX(0%);
    }

    100% {
        transform: translateX(-50%);
    }
}

.animate-marquee {
    display: flex;
    width: max-content;
    animation: scrollMarquee 25s linear infinite;
}

.animate-marquee:hover {
    animation-play-state: paused;
}


:root {
    --atlas-ink: #252038;
    --atlas-plum: #5636a4;
    --atlas-plum-deep: #20152f;
    --atlas-accent: #a994e8;
    --atlas-paper: #f5f1ff;
    --atlas-surface: #ffffff;
    --atlas-line: #e5def2;
    --atlas-muted: #706a80;
}

html {
    scroll-padding-top: 88px;
}

body,
body * {
    font-family: 'Space Grotesk', sans-serif !important;
}

body {
    background: var(--atlas-paper) !important;
    color: var(--atlas-ink) !important;
}

main {
    color: var(--atlas-ink);
}

main>section,
main>header {
    position: relative;
}

main h1,
main h2,
main h3,
main h4 {
    color: var(--atlas-ink);
    letter-spacing: -.035em;
}

main p {
    line-height: 1.75;
}

main a {
    transition: color .2s ease, background-color .2s ease, border-color .2s ease, transform .2s ease;
}


.cbv3 {
    --navy: var(--atlas-plum-deep) !important;
    --ink: var(--atlas-ink) !important;
    --coral: var(--atlas-accent) !important;
    --mist: var(--atlas-paper) !important;
    --line: var(--atlas-line) !important;
    --muted: var(--atlas-muted) !important;
    box-shadow: 0 8px 30px rgba(56, 32, 95, .06);
}

.cbv3-row {
    max-width: none !important;
    height: 78px !important;
}

.cbv3-brand img {
    max-width: 190px !important;
}

.cbv3-navigation>a::after,
.cbv3-navigation>button::after {
    background: var(--atlas-plum) !important;
    height: 2px !important;
}

.cbv3-cta {
    border-radius: 999px !important;
    background: var(--atlas-plum) !important;
    color: white !important;
}

.cbv3-cta:hover {
    background: var(--atlas-plum-deep) !important;
    transform: translateY(-2px);
}

.cbv3-dropdown,
.cbv3-search-panel {
    border-radius: 18px !important;
    border-color: var(--atlas-line) !important;
    box-shadow: 0 22px 50px rgba(56, 32, 95, .14) !important;
}


.ng-hero {
    --ng-navy: var(--atlas-plum-deep) !important;
    --ng-navy-2: var(--atlas-plum) !important;
    --ng-gold: var(--atlas-accent) !important;
    --ng-gold-soft: #f5f1ff !important;
    --ng-lilac: #f5f1ff !important;
    --ng-sky: #eee8fb !important;
    --ng-cream: var(--atlas-paper) !important;
    --ng-line: var(--atlas-line) !important;
    font-family: 'Space Grotesk', sans-serif !important;
    background: var(--atlas-paper) !important;
}

.ng-hero-banner {
    background: var(--atlas-paper) !important;
}

.ng-hero-banner-link {
    max-width: none;
    margin: 0 auto;
    overflow: hidden;
}

.ng-hero-banner img {
    max-height: full !important;
}

.ng-hero-guide {
    background: var(--atlas-paper) !important;
    border: 0 !important;
}

.ng-hero-guide-wrap {
    max-width: none !important;
}

.ng-hero-guide-intro {
    border-radius: 18px !important;
    background: var(--atlas-plum-deep) !important;
}

.ng-hero-step {
    border-radius: 18px !important;
}

.ncc-choose {
    --ncc-ink: var(--atlas-ink);
    --ncc-accent: var(--atlas-plum);
    --ncc-soft: #f5f1ff;
    --ncc-line: var(--atlas-line);
    background: #fff !important;
}

.ncc-choose .ncc-shell {
    max-width: none !important;
}

.ncc-heading h2 {
    font-weight: 700 !important;
}

.ncc-heading h2 em,
.ncc-choose em {
    color: var(--atlas-plum) !important;
}

.ncc-photo {
    border-radius: 22px !important;
}

.ncc-step {
    border-radius: 16px !important;
    background: #faf8fd !important;
}

.ncc-step-no,
.ncc-caption-circle {
    background: var(--atlas-accent) !important;
    color: var(--atlas-plum-deep) !important;
}

.ncc-footer {
    border-radius: 20px !important;
    background: var(--atlas-plum-deep) !important;
}


.cbi-section {
    background: var(--atlas-paper) !important;
}

.cbi-shell {
    max-width: none !important;
}

.cbi-kicker,
.cbi-directory-top,
.cbi-item-num,
.cbi-aside-number {
    color: var(--atlas-plum) !important;
}

.cbi-dot {
    background: var(--atlas-accent) !important;
}

.cbi-aside h2 em {
    color: var(--atlas-plum) !important;
}

.cbi-item {
    background: #fff !important;
    border-color: var(--atlas-line) !important;
    border-radius: 15px !important;
}

.cbi-item[open],
.cbi-item:hover {
    border-color: #c9b9e9 !important;
    background: #fcfaff !important;
}

.cbi-expand {
    background: #f5f1ff !important;
    color: var(--atlas-plum) !important;
    border-radius: 50% !important;
}

.cbi-read,
.cbi-checklist-link {
    color: var(--atlas-plum) !important;
}

.cbi-directory-foot {
    border-radius: 12px !important;
    background: #f5f1ff !important;
}


.fx-section {
    --fx-ink: var(--atlas-ink) !important;
    --fx-accent: var(--atlas-plum) !important;
    --fx-line: var(--atlas-line) !important;
}

.fx-decision,
.fx-payment,
.fx-faq {
    background: var(--atlas-paper) !important;
}

.fx-wrap {
    max-width: none !important;
}

.fx-head h2 em,
.fx-kicker,
.fx-question>span,
.fx-factor-n {
    color: var(--atlas-plum) !important;
}

.fx-comparison,
.fx-comparison-row,
.fx-rule,
.fx-question {
    border-color: var(--atlas-line) !important;
}

.fx-comparison-heading {
    background: var(--atlas-plum-deep) !important;
    color: #fff !important;
}

.fx-comparison-row,
.fx-question {
    background: #fff !important;
}

.fx-rule {
    border-radius: 20px !important;
    background: #eee8fb !important;
}

.fx-rule-big {
    color: var(--atlas-plum) !important;
}

.fx-linkline a,
.fx-linkline strong {
    color: var(--atlas-plum) !important;
}


.chf-footer {
    --navy: var(--atlas-plum-deep) !important;
    --coral: var(--atlas-accent) !important;
    --line: rgba(255, 255, 255, .18) !important;
}

.chf-main {
    background: var(--atlas-plum-deep) !important;
}

.chf-intro {
    border-color: rgba(255, 255, 255, .18) !important;
}

.chf-explore {
    border-radius: 999px !important;
    background: var(--atlas-accent) !important;
    color: var(--atlas-plum-deep) !important;
}

.chf-explore:hover {
    background: #ddd1f5 !important;
}

.chf-bottom {
    background: #20152f !important;
}


.av3 {
    --navy: var(--atlas-plum-deep) !important;
    --navy2: var(--atlas-plum) !important;
    --apricot: var(--atlas-accent) !important;
    --paper: var(--atlas-paper) !important;
    --text: var(--atlas-ink) !important;
    --muted: var(--atlas-muted) !important;
    --line: var(--atlas-line) !important;
}

.av3-hero {
    background: var(--atlas-plum-deep) !important;
}

.av3-hero h1,
.av3-hero p,
.av3-hero a,
.av3-hero span {
    color: #fff;
}

.av3-hero h1 em,
.av3-tag>span {
    color: var(--atlas-accent) !important;
}

.av3-button {
    border-radius: 999px !important;
    background: var(--atlas-accent) !important;
    color: var(--atlas-plum-deep) !important;
}

.av3-values article,
.av3-mission-disclaimer,
.av3-method aside {
    border-color: var(--atlas-line) !important;
}

.av3-values article>i {
    color: var(--atlas-plum) !important;
}

main .bg-slate-50,
main .bg-slate-50\/40,
main .bg-\[\#f8f5ec\] {
    background-color: var(--atlas-paper) !important;
}

main .bg-blue-50,
main .bg-blue-100,
main .bg-\[\#eef5ff\] {
    background-color: #f5f1ff !important;
}

main .text-blue-600,
main .text-blue-700,
main .text-\[\#173947\],
main .hover\:text-\[\#173947\]:hover {
    color: var(--atlas-plum) !important;
}

main .bg-blue-600,
main .bg-\[\#173947\] {
    background-color: var(--atlas-plum) !important;
}

main .border-blue-200,
main .border-slate-200,
main .border-\[\#E4D8CE\],
main .border-\[\#E8DDD3\] {
    border-color: var(--atlas-line) !important;
}

main .rounded-xl,
main .rounded-2xl,
main .rounded-3xl {
    border-radius: 18px !important;
}

main .shadow-sm,
main .shadow-md {
    box-shadow: 0 12px 32px rgba(56, 32, 95, .07) !important;
}

main>main>div>div {
    border-color: var(--atlas-line) !important;
}

main section {
    scroll-margin-top: 92px;
}

@media (max-width: 760px) {
    .ng-hero-banner {
        padding: 12px 12px 0 !important;
    }

    .ng-hero-banner-link {
        border-radius: 16px !important;
    }

    .ncc-choose,
    .cbi-section,
    .fx-section {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .cbv3-shell {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
}


/* Full-width layout and balanced type scale */
html,
body {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
}

body {
    font-size: 15px;
}

main {
    width: 100%;
    max-width: none;
}

main>section,
main>header,
main>footer {
    width: 100%;
    max-width: none;
}

.cbv3-shell,
.chf-container,
.av3-container {
    width: 100% !important;
    max-width: none !important;
}

.ng-hero-banner-link {
    width: 100% !important;
    max-width: none !important;
}

.ng-hero-guide-wrap,
.ncc-choose .ncc-shell,
.cbi-shell,
.fx-wrap {
    width: 100% !important;
    max-width: none !important;
}

.ncc-choose .ncc-shell,
.cbi-shell,
.fx-wrap {
    padding-left: clamp(20px, 5vw, 84px) !important;
    padding-right: clamp(20px, 5vw, 84px) !important;
}

main h1 {
    font-size: clamp(36px, 4.4vw, 60px) !important;
    line-height: 1.08 !important;
}

main h2 {
    font-size: clamp(30px, 3.6vw, 48px) !important;
    line-height: 1.12 !important;
}

main h3 {
    font-size: clamp(22px, 2.4vw, 32px) !important;
    line-height: 1.2 !important;
}

main h4 {
    font-size: clamp(17px, 1.7vw, 22px) !important;
    line-height: 1.3 !important;
}

main p {
    font-size: 14px;
}

.ncc-heading h2 {
    font-size: clamp(40px, 5vw, 66px) !important;
    line-height: 1.02 !important;
}

.ncc-checklist-header h3 {
    font-size: clamp(25px, 2.8vw, 36px) !important;
}

.ncc-step h4 {
    font-size: 17px !important;
}

.cbi-aside h2 {
    font-size: clamp(38px, 4.3vw, 58px) !important;
    line-height: 1.05 !important;
}

.cbi-item-name strong {
    font-size: clamp(16px, 1.45vw, 20px) !important;
}

.fx-head h2,
.fx-faq-intro h2 {
    font-size: clamp(34px, 4vw, 54px) !important;
}

.av3-hero h1 {
    font-size: clamp(40px, 5vw, 64px) !important;
}

.av3 h2 {
    font-size: clamp(30px, 3.5vw, 46px) !important;
}

@media (max-width: 760px) {

    .ncc-choose .ncc-shell,
    .cbi-shell,
    .fx-wrap {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    main h1 {
        font-size: clamp(34px, 8vw, 48px) !important;
    }

    main h2 {
        font-size: clamp(28px, 6vw, 38px) !important;
    }

    main h3 {
        font-size: clamp(21px, 4.5vw, 27px) !important;
    }

    .ncc-heading h2 {
        font-size: clamp(39px, 9vw, 58px) !important;
    }

    .cbi-aside h2 {
        font-size: clamp(37px, 8vw, 52px) !important;
    }
}