:root {
    --navy-bg: #071731;
    --text-primary: #FFFFFF;
    --accent-blue: #98CCFF;
    --rule: #B2BDCD;

    --opacity-text-muted: 0.6;
    --opacity-accent-text: 0.7;
    --opacity-meta-text: 0.5;
    --opacity-rule: 0.4;
    --opacity-cta-rule: 0.58;

    --structural-rule-color: rgb(from var(--rule) r g b / var(--opacity-rule));
    --cta-rule-color: rgb(from var(--accent-blue) r g b / var(--opacity-cta-rule));
    --section-divider-color: rgb(from var(--rule) r g b / 0.1);
    --structural-rule-thickness: 1.3px;
    --connector-rule-thickness: 1.8px;
    --cta-rule-thickness: 1px;
    --section-divider-thickness: 1px;
    --section-divider-inset: 24px;
    --section-transition: 112px;
    --section-divider-midpoint: calc(var(--section-transition) / 2);
    --section-divider-after-adjustment: 0px;

    --font-libre-caslon-display: "Libre Caslon Display", Georgia, serif;
    --font-inter: "Inter", Arial, sans-serif;
    --font-inria-serif: "Inria Serif", Georgia, serif;

    --type-comparison-body-size: 22px;
    --type-comparison-body-line-height: 42px;
    --type-comparison-body-tracking: 0.7px;
    --type-process-description-size: 21px;
    --type-process-description-line-height: 34px;
    --type-process-description-tracking: 0.3px;
    --type-cta-size: 14px;
    --type-cta-line-height: 20px;
    --type-cta-tracking: 0.24em;

    --page-max-width: 1440px;
    --page-gutter: 24px;
}

@media (min-width: 640px) {
    :root {
        --page-gutter: 32px;
        --section-transition: 152px;
        --section-divider-inset: 32px;
    }
}

@media (min-width: 960px) {
    :root {
        --page-gutter: 48px;
        --section-transition: 192px;
        --section-divider-inset: 64px;
    }
}

@media (min-width: 1340px) {
    :root {
        --section-transition: 240px;
        --section-divider-inset: 80px;
    }
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    min-block-size: 100%;
    background-color: var(--navy-bg);
    color-scheme: dark;
    overscroll-behavior-y: none;
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
}

body {
    min-block-size: 100vh;
    min-block-size: 100dvh;
    margin: 0;
    background-color: var(--navy-bg);
    color: var(--text-primary);
    font-family: var(--font-inter);
    line-height: 1.5;
    overscroll-behavior-y: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    isolation: isolate;
}

:where(h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd) {
    margin: 0;
}

:where(ul, ol) {
    margin: 0;
    padding: 0;
}

:where(button, input, textarea, select) {
    color: inherit;
    font: inherit;
}

:where(img, picture, svg, canvas, video) {
    display: block;
    max-inline-size: 100%;
    block-size: auto;
}

a {
    color: inherit;
}

table {
    border-collapse: collapse;
}

[hidden] {
    display: none !important;
}

.sr-only {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.site-background {
    position: fixed;
    inset: 0;
    z-index: 0;
    background-color: var(--navy-bg);
    background-image: url("/assets/bg-navy-desktop.webp");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    pointer-events: none;
}

@media (max-width: 1023px) {
    .site-background {
        inset-block-end: auto;
        block-size: 100lvh;
        background-image: url("/assets/bg-navy-tablet.webp");
    }
}

@media (max-width: 767px) {
    .site-background {
        background-image: url("/assets/bg-navy-mobile.webp");
    }
}

.site-page {
    position: relative;
    z-index: 1;
    inline-size: 100%;
    max-inline-size: var(--page-max-width);
    min-block-size: 100vh;
    min-block-size: 100dvh;
    margin-inline: auto;
}

.site-header {
    --header-top-offset: 30px;
    --header-lockup-width: 131px;
    --header-contact-size: 22px;

    position: absolute;
    inset-block-start: var(--header-top-offset);
    inset-inline: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    inline-size: 100%;
    padding-inline: var(--page-gutter);
}

.site-header__brand {
    flex: 0 0 auto;
    inline-size: var(--header-lockup-width);
}

.site-header__lockup {
    inline-size: 100%;
}

.site-header__contact {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    color: var(--accent-blue);
    font-family: var(--font-inria-serif);
    font-size: var(--header-contact-size);
    font-style: normal;
    font-weight: 300;
    line-height: 1;
    letter-spacing: 0.07em;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    opacity: var(--opacity-text-muted);
}

.hero {
    --hero-height: 941px;
    --hero-lockup-top: 233px;
    --hero-headline-size: clamp(38px, 3.819444vw, 55px);
    --hero-headline-line-height: clamp(52px, 4.861111vw, 70px);
    --hero-headline-tracking: clamp(1.8px, 0.229167vw, 3.3px);

    display: flex;
    flex-direction: column;
    align-items: center;
    inline-size: 100%;
    block-size: var(--hero-height);
}

.hero__lockup {
    flex: 0 0 auto;
    inline-size: min(384px, calc(100% - 64px));
    margin-block-start: var(--hero-lockup-top);
}

.hero__eyebrow {
    inline-size: max-content;
    max-inline-size: calc(100% - 48px);
    margin-block-start: 20px;
    color: var(--accent-blue);
    font-family: var(--font-inter);
    font-size: clamp(12px, 1.458333vw, 21px);
    font-style: normal;
    font-weight: 400;
    line-height: 25px;
    letter-spacing: clamp(2px, 0.416667vw, 6px);
    text-align: center;
    opacity: var(--opacity-accent-text);
}

.hero__headline {
    inline-size: min(456px, calc(100% - 48px));
    margin-block-start: 81px;
    color: var(--text-primary);
    font-family: var(--font-libre-caslon-display);
    font-size: var(--hero-headline-size);
    font-style: italic;
    font-weight: 400;
    line-height: var(--hero-headline-line-height);
    letter-spacing: var(--hero-headline-tracking);
    text-align: center;
    white-space: nowrap;
    font-feature-settings: "sinf" 1;
}

.hero__headline span {
    display: block;
}

.hero__cta {
    display: inline-flex;
    flex: 0 0 auto;
    justify-content: center;
    margin-block-start: 34px;
    text-decoration: none;
}

.text-cta {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    padding-block-end: 7px;
    border-block-end: var(--cta-rule-thickness) solid var(--cta-rule-color);
    color: var(--accent-blue);
    font-family: var(--font-inter);
    font-size: var(--type-cta-size);
    font-style: normal;
    font-weight: 300;
    line-height: var(--type-cta-line-height);
    letter-spacing: var(--type-cta-tracking);
    white-space: nowrap;
}

.hero__cta:focus-visible,
.site-closing__cta:focus-visible {
    outline: 2px solid var(--accent-blue);
    outline-offset: 8px;
}

@media (max-width: 389px) {
    .hero {
        --hero-height: clamp(820px, calc(605px + 86.15vw), 941px);
        --hero-headline-size: clamp(27px, calc(7.667px + 7.778vw), 38px);
        --hero-headline-line-height: clamp(38px, calc(13px + 10vw), 52px);
        --hero-headline-tracking: clamp(1.2px, calc(0.129px + 0.429vw), 1.8px);
    }
}

@media (max-width: 300px) {
    .site-header {
        --header-top-offset: clamp(24px, calc(-6px + 12vw), 30px);
        --header-lockup-width: clamp(110px, calc(5px + 42vw), 131px);
        --header-contact-size: clamp(18.5px, calc(1px + 7vw), 22px);
    }

    .hero {
        --hero-lockup-top: clamp(210px, calc(95px + 46vw), 233px);
    }

    .hero__headline {
        white-space: normal;
    }
}

.transaction-gateway {
    --section-content-start: 14px;
    --section-transition-internal-space: 200px;
    --gateway-content-gap: 76px;
    --gateway-caption-gap: clamp(74px, calc(164.667px - 6.296296vw), 108px);
    --gateway-caption-size: var(--type-comparison-body-size);
    --gateway-caption-line-height: var(--type-comparison-body-line-height);
    --gateway-caption-tracking: var(--type-comparison-body-tracking);

    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: var(--gateway-content-gap);
    inline-size: 100%;
    margin-block-start: max(0px, calc(var(--section-transition) - var(--section-transition-internal-space)));
    padding-block: 14px 54px;
}

.transaction-gateway__heading {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    align-items: center;
    row-gap: 15px;
    inline-size: 100%;
}

.transaction-gateway__eyebrow {
    inline-size: max-content;
    max-inline-size: calc(100% - 48px);
    color: var(--accent-blue);
    font-family: var(--font-inter);
    font-size: clamp(12px, 1.215278vw, 17.5px);
    font-style: normal;
    font-weight: 300;
    line-height: 25px;
    letter-spacing: clamp(2px, 0.347222vw, 5px);
    text-align: center;
    opacity: var(--opacity-accent-text);
}

.transaction-gateway__headline {
    inline-size: min(772px, calc(100% - 48px));
    min-block-size: 120px;
    color: var(--text-primary);
    font-family: var(--font-libre-caslon-display);
    font-size: clamp(39px, 4.159722vw, 59.9px);
    font-style: normal;
    font-weight: 400;
    line-height: clamp(46px, 4.166667vw, 60px);
    letter-spacing: clamp(1.8px, 0.208333vw, 3px);
    text-align: center;
    white-space: nowrap;
    font-feature-settings: "sinf" 1;
}

.transaction-gateway__headline span {
    display: block;
}

.transaction-gateway__figure {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    align-items: center;
    row-gap: var(--gateway-caption-gap);
    inline-size: min(900px, calc(100% - 48px));
    padding: 8px 12px;
}

.transaction-gateway__picture {
    inline-size: 100%;
}

.transaction-gateway__diagram {
    inline-size: 100%;
}

.transaction-gateway__caption {
    inline-size: min(1200px, calc(100vw - (2 * var(--page-gutter))));
    color: var(--text-primary);
    font-family: var(--font-inter);
    font-size: var(--gateway-caption-size);
    font-style: normal;
    font-weight: 300;
    line-height: var(--gateway-caption-line-height);
    letter-spacing: var(--gateway-caption-tracking);
    text-align: center;
}

@media (min-width: 1120px) and (max-width: 1439px) {
    .transaction-gateway {
        --gateway-caption-size: clamp(19px, calc(8.5px + 0.9375vw), 22px);
        --gateway-caption-line-height: clamp(31px, calc(-7.5px + 3.4375vw), 42px);
    }
}

@media (max-width: 1119px) {
    .transaction-gateway {
        --gateway-caption-size: 19px;
        --gateway-caption-line-height: 30px;
    }
}

@media (max-width: 959px) {
    .transaction-gateway {
        --gateway-caption-size: 18px;
        --gateway-caption-line-height: 28px;
    }
}

@media (max-width: 639px) {
    .transaction-gateway {
        --gateway-caption-size: 17px;
        --gateway-caption-line-height: 26px;
    }
}

@media (max-width: 559px) {
    .transaction-gateway {
        --gateway-content-gap: clamp(44px, calc(32px + 4vw), 54px);
        --gateway-caption-gap: calc(var(--gateway-content-gap) + 7px);
    }

    .transaction-gateway__heading {
        row-gap: 12px;
    }

    .transaction-gateway__eyebrow {
        font-size: clamp(10px, calc(7px + 0.9vw), 12px);
        line-height: 22px;
        letter-spacing: clamp(1.25px, calc(0.5px + 0.27vw), 2px);
    }

    .transaction-gateway__headline {
        min-block-size: 0;
        font-size: clamp(22px, calc(7px + 5vw), 35px);
        line-height: clamp(30px, calc(15px + 5vw), 43px);
        letter-spacing: clamp(1.2px, calc(0.35px + 0.25vw), 1.75px);
        white-space: normal;
    }

    .transaction-gateway__figure {
        padding: 10px 16px;
    }
}

.how-it-works {
    --section-content-start: 24px;
    --section-transition-internal-space: 88px;
    --how-title-size: 18px;
    --how-title-tracking: 4.1px;
    --how-number-size: 40px;
    --how-number-line-height: 36px;
    --how-number-tracking: 8px;
    --how-label-size: 21px;
    --how-label-tracking: 4.2px;
    --how-description-size: var(--type-process-description-size);
    --how-description-line-height: var(--type-process-description-line-height);
    --process-number-width: 47px;

    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    inline-size: 100%;
    margin-block-start: max(0px, calc(var(--section-transition) - var(--section-transition-internal-space)));
    padding-block: 24px 20px;
}

.how-it-works__title {
    flex: 0 0 auto;
    inline-size: 212px;
    block-size: 36px;
    color: var(--text-primary);
    font-family: var(--font-inter);
    font-size: var(--how-title-size);
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: var(--how-title-tracking);
    white-space: nowrap;
}

.how-it-works__steps {
    --process-header-inset: 25%;
    --process-element-gap: 16px;
    --process-connector-end-gap: 24px;
    --process-description-measure: 300px;

    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    flex: 0 0 auto;
    inline-size: 100%;
    block-size: 151px;
    margin-block-start: 20px;
    padding-inline: var(--page-gutter);
}

.how-step {
    position: relative;
    min-inline-size: 0;
}

.how-step:not(:last-child)::after {
    position: absolute;
    inset-block-start: 67px;
    inset-inline-start: 100%;
    inline-size: var(--connector-rule-thickness);
    block-size: 106px;
    background-color: var(--structural-rule-color);
    content: "";
}

.how-step__heading {
    display: flex;
    align-items: center;
    column-gap: var(--process-element-gap);
    block-size: 49px;
    padding-block-start: 3px;
    padding-inline-start: var(--process-header-inset);
}

.how-step__heading--connected {
    inline-size: calc(100% + var(--process-header-inset));
    padding-inline-end: var(--process-connector-end-gap);
}

.how-step__number {
    flex: 0 0 var(--process-number-width);
    inline-size: var(--process-number-width);
    block-size: var(--how-number-line-height);
    color: var(--accent-blue);
    font-family: "Instrument Serif", Georgia, serif;
    font-size: var(--how-number-size);
    font-style: normal;
    font-weight: 400;
    line-height: var(--how-number-line-height);
    letter-spacing: var(--how-number-tracking);
    white-space: nowrap;
}

.how-step__label {
    flex: 0 0 auto;
    color: var(--accent-blue);
    font-family: var(--font-inter);
    font-size: var(--how-label-size);
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: var(--how-label-tracking);
    white-space: nowrap;
}

.how-step__connector {
    align-self: center;
    flex: 1 1 auto;
    min-inline-size: 0;
    block-size: var(--connector-rule-thickness);
    background-color: var(--structural-rule-color);
}

.how-step__description {
    inline-size: min(var(--process-description-measure), 100%);
    block-size: 88px;
    margin-block-start: 13px;
    margin-inline: auto;
    color: var(--text-primary);
    font-family: var(--font-inter);
    font-size: var(--how-description-size);
    font-style: normal;
    font-weight: 500;
    line-height: var(--how-description-line-height);
    letter-spacing: var(--type-process-description-tracking);
    text-align: center;
    opacity: var(--opacity-text-muted);
}

@media (min-width: 840px) and (max-width: 1339px) {
    .how-it-works {
        --how-title-size: clamp(15px, calc(9.96px + 0.6vw), 18px);
        --how-title-tracking: clamp(3px, calc(0.8px + 0.25vw), 4.1px);
        --how-number-size: clamp(32px, calc(18.56px + 1.6vw), 40px);
        --how-number-line-height: clamp(30px, calc(19.92px + 1.2vw), 36px);
        --how-number-tracking: clamp(6px, calc(2.64px + 0.4vw), 8px);
        --how-label-size: clamp(16px, calc(7.6px + 1vw), 21px);
        --how-label-tracking: clamp(3px, calc(0.984px + 0.24vw), 4.2px);
        --how-description-size: clamp(17px, calc(10.28px + 0.8vw), 21px);
        --how-description-line-height: clamp(26px, calc(12.56px + 1.6vw), 34px);
        --process-number-width: clamp(39px, calc(25.56px + 1.6vw), 47px);
    }

    .how-it-works__steps {
        --process-element-gap: clamp(10px, calc(-0.08px + 1.2vw), 16px);
        --process-connector-end-gap: clamp(16px, calc(2.56px + 1.6vw), 24px);
    }
}

@media (max-width: 839px) {
    .how-it-works {
        --how-title-size: 15px;
        --how-title-tracking: 3px;
        --how-number-size: clamp(28px, calc(26.4px + 0.667vw), 32px);
        --how-number-line-height: clamp(28px, calc(27.2px + 0.333vw), 30px);
        --how-number-tracking: clamp(5px, calc(4.133px + 0.222vw), 6px);
        --how-label-size: clamp(14px, calc(13.2px + 0.333vw), 16px);
        --how-label-tracking: clamp(2.8px, calc(2.627px + 0.044vw), 3px);
        --how-description-size: clamp(16px, calc(15.2px + 0.214vw), 17px);
        --how-description-line-height: clamp(24px, calc(22.4px + 0.429vw), 26px);
        --process-number-width: clamp(52px, 8vw, 64px);
        --process-stage-gap: clamp(48px, calc(36px + 3.333vw), 64px);
        --process-heading-description-gap: clamp(14px, calc(12.5px + 0.375vw), 16px);
        --process-spine-breathing-space: 12px;

        padding-block-end: 0;
    }

    .how-it-works__steps {
        --process-description-measure: 32ch;

        grid-template-columns: minmax(0, 1fr);
        inline-size: min(600px, 100%);
        block-size: auto;
        margin-block-start: clamp(28px, calc(21px + 1.667vw), 36px);
    }

    .how-step {
        display: grid;
        grid-template-columns: var(--process-number-width) minmax(0, 1fr);
    }

    .how-step:not(:last-child) {
        padding-block-end: var(--process-stage-gap);
    }

    .how-step:not(:last-child)::after {
        inset-block-start: calc(var(--how-number-line-height) + var(--process-spine-breathing-space));
        inset-block-end: var(--process-spine-breathing-space);
        inset-inline-start: calc((var(--process-number-width) - var(--connector-rule-thickness)) / 2);
        block-size: auto;
    }

    .how-step__heading {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: var(--process-number-width) minmax(0, 1fr);
        align-items: baseline;
        column-gap: 0;
        inline-size: 100%;
        block-size: auto;
        padding: 0;
    }

    .how-step__number {
        grid-column: 1;
        text-align: center;
    }

    .how-step__label {
        grid-column: 2;
        line-height: 1.25;
    }

    .how-step__connector {
        display: none;
    }

    .how-step__description {
        grid-column: 2;
        block-size: auto;
        margin-block-start: var(--process-heading-description-gap);
        margin-inline: 0;
        text-align: left;
    }
}

.why-pediment {
    --section-content-start: 110px;
    --section-transition-internal-space: 110px;
    --why-label-size: 19px;
    --why-label-line-height: normal;
    --why-editorial-size: 35px;
    --why-editorial-line-height: 51px;
    --why-editorial-measure: none;
    --why-editorial-inline-padding: 24px;
    --why-benefit-size: var(--type-comparison-body-size);
    --why-benefit-line-height: var(--type-comparison-body-line-height);
    --why-benefit-measure: 356px;
    --why-benefit-inline-padding: 32px;

    position: relative;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    inline-size: 100%;
    block-size: 650px;
    margin-block-start: max(
        0px,
        calc(
            var(--section-transition) - var(--section-transition-internal-space) +
                var(--section-divider-after-adjustment)
        )
    );
    padding-inline: var(--page-gutter);
}

.why-pediment__column {
    position: relative;
    min-inline-size: 0;
}

.why-pediment__column--ruled::after {
    position: absolute;
    inset-block-start: 81px;
    inset-inline-start: 0;
    inline-size: var(--structural-rule-thickness);
    block-size: 506px;
    background-color: var(--structural-rule-color);
    content: "";
}

.why-pediment__content {
    inline-size: 100%;
    margin-block-start: 110px;
}

.why-pediment__column--editorial .why-pediment__content {
    max-inline-size: var(--why-editorial-measure);
}

.why-pediment__column--editorial {
    padding-inline: var(--why-editorial-inline-padding);
}

.why-pediment__column--benefits {
    padding-inline: var(--why-benefit-inline-padding);
}

.why-pediment__content--benefits {
    max-inline-size: var(--why-benefit-measure);
    margin-inline: auto;
}

.why-pediment__label {
    min-block-size: 36px;
    color: var(--accent-blue);
    font-family: var(--font-inter);
    font-size: var(--why-label-size);
    font-style: normal;
    font-weight: 300;
    line-height: var(--why-label-line-height);
    letter-spacing: 3.8px;
    white-space: nowrap;
}

.why-pediment__statements {
    display: grid;
    row-gap: 48px;
    margin-block-start: 20px;
}

.why-pediment__statements p {
    color: var(--text-primary);
    font-family: var(--font-libre-caslon-display);
    font-size: var(--why-editorial-size);
    font-style: normal;
    font-weight: 400;
    line-height: var(--why-editorial-line-height);
    letter-spacing: 0.4px;
    font-feature-settings: "sinf" 1;
}

@media (min-width: 1120px) and (max-width: 1439px) {
    .why-pediment {
        --why-editorial-size: clamp(27.4px, calc(0.8px + 2.375vw), 35px);
        --why-editorial-line-height: clamp(41px, calc(6px + 3.125vw), 51px);
        --why-editorial-inline-padding: clamp(12px, calc(-30px + 3.75vw), 24px);
        --why-benefit-size: clamp(19px, calc(8.5px + 0.9375vw), 22px);
        --why-benefit-line-height: clamp(31px, calc(-7.5px + 3.4375vw), 42px);
        --why-benefit-inline-padding: clamp(20px, calc(-22px + 3.75vw), 32px);
    }
}

@media (min-width: 1120px) {
    .why-pediment {
        --section-divider-after-adjustment: 29px;
    }

    .why-statement__line {
        display: block;
        white-space: nowrap;
    }
}

.why-pediment__benefits {
    display: grid;
    grid-template-rows: 115px 42px 115px 42px 115px;
    inline-size: 100%;
    margin-block-start: 13px;
    font-size: var(--why-benefit-size);
    line-height: var(--why-benefit-line-height);
    letter-spacing: var(--type-comparison-body-tracking);
    list-style: none;
}

.why-pediment__benefits::before,
.why-pediment__benefits::after {
    align-self: center;
    grid-column: 1;
    inline-size: 100%;
    block-size: var(--structural-rule-thickness);
    background-color: var(--structural-rule-color);
    content: "";
}

.why-pediment__benefits::before {
    grid-row: 2;
}

.why-pediment__benefits::after {
    grid-row: 4;
}

.why-pediment__benefits li {
    display: flex;
    align-items: center;
    color: var(--text-primary);
    font-family: var(--font-inter);
    font-style: normal;
    font-weight: 300;
}

.why-pediment__benefits li:nth-child(1) {
    grid-row: 1;
}

.why-pediment__benefits li:nth-child(2) {
    grid-row: 3;
}

.why-pediment__benefits li:nth-child(3) {
    grid-row: 5;
}

@media (max-width: 1119px) {
    .why-pediment {
        --section-content-start: 108px;
        --section-transition-internal-space: 108px;
        --why-benefit-rule-color: rgb(from var(--rule) r g b / 0.2);
        --why-label-size: 18px;
        --why-label-line-height: 24px;
        --why-editorial-size: 32px;
        --why-editorial-line-height: 43px;
        --why-editorial-measure: 42ch;
        --why-benefit-size: 19px;
        --why-benefit-line-height: 30px;
        --why-benefit-measure: 34ch;

        grid-template-columns: repeat(2, minmax(0, 1fr));
        block-size: auto;
        padding: 108px var(--page-gutter) 80px;
    }

    .why-pediment__column--ruled::after {
        content: none;
    }

    .why-pediment__column--editorial {
        grid-column: 1 / -1;
        padding: 0 0 72px;
        border-block-end: var(--structural-rule-thickness) solid var(--structural-rule-color);
    }

    .why-pediment__column--benefits {
        padding: 64px 32px 72px;
    }

    .why-pediment__column--benefits + .why-pediment__column--benefits::before {
        position: absolute;
        inset-block: 0;
        inset-inline-start: 0;
        inline-size: var(--structural-rule-thickness);
        background-color: var(--structural-rule-color);
        content: "";
    }

    .why-pediment__content {
        margin-block-start: 0;
    }

    .why-pediment__content--benefits {
        margin-inline: 0;
    }

    .why-pediment__benefits {
        grid-template-rows: none;
        margin-block-start: 12px;
    }

    .why-pediment__benefits::before,
    .why-pediment__benefits::after {
        content: none;
    }

    .why-pediment__benefits li {
        padding-block: 18px;
    }

    .why-pediment__benefits li + li {
        border-block-start: var(--structural-rule-thickness) solid var(--why-benefit-rule-color);
    }

    .why-pediment__benefits li:nth-child(1),
    .why-pediment__benefits li:nth-child(2),
    .why-pediment__benefits li:nth-child(3) {
        grid-row: auto;
    }

    .why-pediment__statements {
        row-gap: 40px;
        margin-block-start: 18px;
    }

    .why-pediment__label {
        min-block-size: var(--why-label-line-height);
    }
}

@media (max-width: 959px) {
    .why-pediment {
        --section-content-start: 64px;
        --section-transition-internal-space: 64px;
        --why-label-size: 16px;
        --why-label-line-height: 22px;
        --why-editorial-size: 30px;
        --why-editorial-line-height: 40px;
        --why-editorial-measure: 38ch;
        --why-benefit-size: 18px;
        --why-benefit-line-height: 28px;

        grid-template-columns: 1fr;
        padding-block: 64px;
    }

    .why-pediment__column--editorial {
        grid-column: auto;
        padding-block-end: 64px;
    }

    .why-pediment__column--benefits {
        padding: 56px 0;
    }

    .why-pediment__column--benefits:not(:last-child) {
        border-block-end: var(--structural-rule-thickness) solid var(--structural-rule-color);
    }

    .why-pediment__column--benefits:last-child {
        padding-block-end: 0;
    }

    .why-pediment__column--benefits + .why-pediment__column--benefits::before {
        content: none;
    }

    .why-pediment__benefits li {
        padding-block: 16px;
    }

    .why-pediment__statements {
        row-gap: 36px;
        margin-block-start: 18px;
    }
}

@media (max-width: 639px) {
    .why-pediment {
        --section-content-start: 36px;
        --section-transition-internal-space: 36px;
        --why-label-size: 15px;
        --why-label-line-height: 21px;
        --why-editorial-size: 28px;
        --why-editorial-line-height: 38px;
        --why-editorial-measure: 31ch;
        --why-benefit-size: 17px;
        --why-benefit-line-height: 26px;
        --why-benefit-measure: 36ch;

        padding-block: 36px 56px;
    }

    .why-pediment__column--editorial {
        padding-block-end: 48px;
    }

    .why-pediment__column--benefits {
        padding: 48px 0;
    }

    .why-pediment__benefits li {
        padding-block: 15px;
    }

    .why-pediment__statements {
        row-gap: 32px;
        margin-block-start: 16px;
    }
}

.site-closing {
    --closing-section-gap: 128px;
    --closing-headline-size: 37px;
    --closing-headline-line-height: 55px;
    --closing-headline-tracking: 2px;
    --closing-headline-padding-block: 20px;
    --closing-headline-cta-gap: 80px;
    --closing-cta-size: var(--type-cta-size);
    --closing-cta-line-height: var(--type-cta-line-height);
    --closing-cta-email-gap: 16px;
    --closing-email-size: 20px;
    --closing-email-stack-gap: 4px;
    --closing-social-gap: 12px;
    --closing-social-size: 20px;
    --closing-bottom-space: 80px;

    display: flex;
    flex-direction: column;
    align-items: center;
    inline-size: min(809px, calc(100% - var(--page-gutter) - var(--page-gutter)));
    margin-block-start: var(--closing-section-gap);
    margin-inline: auto;
    padding-block-end: var(--closing-bottom-space);
}

.site-closing__headline {
    display: flex;
    flex-direction: column;
    align-items: center;
    inline-size: 100%;
    padding-block: var(--closing-headline-padding-block);
    color: var(--text-primary);
    font-family: var(--font-libre-caslon-display);
    font-size: var(--closing-headline-size);
    font-style: normal;
    font-weight: 400;
    line-height: var(--closing-headline-line-height);
    letter-spacing: var(--closing-headline-tracking);
    text-align: center;
    font-feature-settings: "sinf" 1;
}

.site-closing__headline span {
    display: block;
}

.site-closing__cta {
    display: inline-flex;
    margin-block-start: var(--closing-headline-cta-gap);
    text-decoration: none;
}

.site-closing__cta .text-cta {
    font-size: var(--closing-cta-size);
    line-height: var(--closing-cta-line-height);
}

.site-closing__contact {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--closing-email-stack-gap);
    margin-block-start: var(--closing-cta-email-gap);
}

.site-closing__email {
    color: var(--accent-blue);
    font-family: var(--font-inter);
    font-size: var(--closing-email-size);
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0.04em;
    text-decoration: none;
    opacity: var(--opacity-meta-text);
    white-space: nowrap;
}

.site-closing__linkedin {
    display: inline-flex;
    inline-size: var(--closing-social-size);
    block-size: var(--closing-social-size);
    margin-block-start: calc(var(--closing-social-gap) - var(--closing-email-stack-gap));
    color: var(--text-primary);
    opacity: var(--opacity-text-muted);
}

.site-closing__linkedin svg {
    display: block;
    inline-size: 100%;
    block-size: 100%;
}

.site-closing__email:focus-visible,
.site-closing__linkedin:focus-visible {
    outline: 2px solid var(--accent-blue);
    outline-offset: 4px;
}

@media (min-width: 840px) and (max-width: 1339px) {
    .site-closing {
        --closing-headline-size: clamp(31.5px, calc(22.26px + 1.1vw), 37px);
        --closing-headline-line-height: clamp(45px, calc(28.2px + 2vw), 55px);
        --closing-headline-tracking: clamp(1.6px, calc(0.928px + 0.08vw), 2px);
        --closing-headline-padding-block: clamp(16px, calc(9.28px + 0.8vw), 20px);
        --closing-headline-cta-gap: clamp(68px, calc(47.84px + 2.4vw), 80px);
        --closing-cta-size: clamp(13px, calc(11.32px + 0.2vw), 14px);
        --closing-cta-line-height: clamp(18.5px, calc(15.98px + 0.3vw), 20px);
        --closing-cta-email-gap: clamp(14px, calc(10.64px + 0.4vw), 16px);
        --closing-email-size: clamp(18px, calc(14.64px + 0.4vw), 20px);
        --closing-social-size: clamp(18px, calc(14.64px + 0.4vw), 20px);
        --closing-bottom-space: clamp(64px, calc(37.12px + 3.2vw), 80px);
    }
}

@media (max-width: 839px) {
    .site-closing {
        --closing-section-gap: clamp(96px, calc(80.8px + 3.9vw), 112px);
        --closing-headline-size: clamp(20px, calc(13.85px + 2.05vw), 31.05px);
        --closing-headline-line-height: clamp(28px, calc(18.55px + 3.15vw), 45px);
        --closing-headline-tracking: clamp(1px, calc(0.666px + 0.111vw), 1.6px);
        --closing-headline-padding-block: clamp(12px, calc(9.78px + 0.74vw), 16px);
        --closing-headline-cta-gap: clamp(48px, calc(39.1px + 2.97vw), 64px);
        --closing-cta-size: clamp(12px, calc(11.44px + 0.186vw), 13px);
        --closing-cta-line-height: clamp(18px, calc(17.44px + 0.186vw), 19px);
        --closing-cta-email-gap: clamp(12px, calc(10.89px + 0.371vw), 14px);
        --closing-email-size: clamp(15.5px, calc(14.11px + 0.464vw), 18px);
        --closing-social-size: 18px;
        --closing-bottom-space: clamp(48px, calc(39.1px + 2.97vw), 64px);
    }
}

@media (max-width: 719px) {
    .site-closing__headline {
        display: block;
        max-inline-size: min(clamp(23ch, 72vw, 30ch), 100%);
    }

    .site-closing__headline span {
        display: inline;
    }
}

.transaction-gateway::before,
.why-pediment::before,
.how-it-works::before {
    position: absolute;
    inset-block-start: calc(var(--section-content-start) - var(--section-divider-midpoint));
    inset-inline: var(--section-divider-inset);
    block-size: var(--section-divider-thickness);
    background-color: var(--section-divider-color);
    content: "";
    pointer-events: none;
}

.why-pediment::before {
    inset-block-start: calc(
        var(--section-content-start) - var(--section-divider-midpoint) -
            var(--section-divider-after-adjustment)
    );
}

.section-scroll-cue {
    position: fixed;
    inset-block-end: 36px;
    inset-inline-start: 50%;
    z-index: 3;
    display: grid;
    place-items: center;
    inline-size: 22px;
    block-size: 22px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--accent-blue);
    opacity: 0;
    visibility: hidden;
    transform: translate(-50%, 4px);
    transition:
        opacity 240ms ease,
        transform 240ms ease,
        visibility 0s linear 240ms;
    pointer-events: none;
    cursor: pointer;
    appearance: none;
}

.section-scroll-cue.is-visible {
    opacity: 0.64;
    visibility: visible;
    transform: translate(-50%, 0);
    transition-delay: 0s;
    pointer-events: auto;
}

.section-scroll-cue:hover {
    opacity: 0.9;
}

.section-scroll-cue:focus-visible {
    outline: 2px solid var(--accent-blue);
    outline-offset: 6px;
}

.section-scroll-cue svg {
    inline-size: 100%;
    block-size: 100%;
}

@media (max-width: 639px) {
    .section-scroll-cue {
        inset-block-end: 28px;
        inline-size: 20px;
        block-size: 20px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    .section-scroll-cue {
        transform: translate(-50%, 0);
        transition: none;
    }
}