@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500&family=Space+Mono:wght@700&display=swap');

.hs-hero {
    position: relative;
    width: 100%;
    height: var(--hs-story-length, 900vh);
    min-height: 200vh;

    background: #0e0e10;
    overflow: visible;
}

.hs-hero__sticky {
    position: sticky;
    top: 0;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    background: #0e0e10;
    isolation: isolate;
}

.hs-hero__canvas,
.hs-hero__loop-canvas,
.hs-hero__noscript {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hs-hero__canvas {
    z-index: 0;
    pointer-events: none;
}

.hs-hero__loop-canvas {
    z-index: 1;
    pointer-events: none;
    opacity: 0;
    transition: none;
}

.hs-hero__text-layer,
.hs-hero__beat,
.hs-hero__logo-beat,
.hs-hero__continuation {
    position: absolute;
    inset: 0;
}

.hs-hero__gradient-layer,
.hs-hero__text-layer {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.hs-hero__gradient-layer {
    z-index: 2;
    display: block;
}

.hs-hero__text-layer {
    z-index: 3;
}

.hs-hero__beat,
.hs-hero__logo-beat {
    pointer-events: none;
}

.hs-hero__beat[data-hs-active='true'] {
    pointer-events: auto;
}

.hs-hero__beat-content {
    position: absolute;
    z-index: 2;
    left: var(--hs-left-d, auto);
    right: var(--hs-right-d, auto);
    top: var(--hs-top-d, auto);
    bottom: var(--hs-bottom-d, auto);
    width: var(--hs-main-width-d, 38vw);
    transform: var(--hs-transform-d, none);
    color: #fff;
}

.hs-hero__beat-motion {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    opacity: 0;
    transform-origin: center;
    will-change: opacity, transform;
}

.hs-hero__line {
    margin: 0;
    color: #fff;
    text-transform: uppercase;
    white-space: nowrap;
    text-box-trim: trim-both;
    text-box-edge: cap alphabetic;
}

.hs-hero__line--main {
    width: 100%;
    font-family: 'Space Mono', monospace;
    font-weight: 700;
    letter-spacing: 0;
    text-align: left;
}

.hs-hero__line--side {
    width: var(--hs-side-width-d, 90%);
    align-self: var(--hs-side-self-d, flex-end);
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    letter-spacing: .13em;
    text-align: var(--hs-side-align-d, right);
}

.hs-hero__gradient {
    position: absolute;
    z-index: 2;
    left: var(--hs-gradient-left-d, auto);
    right: var(--hs-gradient-right-d, auto);
    top: var(--hs-gradient-top-d, auto);
    bottom: var(--hs-gradient-bottom-d, auto);
    width: var(--hs-gradient-width-d, 50vw);
    height: var(--hs-gradient-height-d, 100%);
    transform: var(--hs-gradient-transform-d, none);
    background: var(--hs-gradient-background-d, linear-gradient(to left, rgba(0,0,0,.94), rgba(0,0,0,.18) 72%, rgba(0,0,0,0)));
    mix-blend-mode: multiply;
    opacity: 0;
    will-change: opacity;
    pointer-events: none;
}

/* Opening logo. Size is derived from the vertical space between the
   configured top edge and the configured gap above the viewport center. */
.hs-hero__logo-beat {
    z-index: 4;
}

.hs-hero__logo-content {
    position: absolute;
    left: var(--hs-logo-left-d, 50%);
    right: var(--hs-logo-right-d, auto);
    top: var(--hs-logo-top-offset-d, 8vh);
    height: max(1px, calc(50vh - var(--hs-logo-top-offset-d, 8vh) - var(--hs-logo-center-gap-d, 8vh)));
    width: auto;
    transform: translateX(var(--hs-logo-translate-x-d, -50%));
    overflow: visible;
}

.hs-hero__logo-content .hs-hero__beat-motion {
    width: auto;
    height: 100%;
    max-width: none;
    gap: 0;
}

.hs-hero__logo-picture {
    display: block;
    width: auto;
    height: 100%;
    transform: none;
}

.hs-hero__logo-image {
    display: block;
    width: auto;
    height: 100%;
    max-width: calc(100vw - 32px);
    object-fit: contain;
}

.hs-hero__scroll-cue {
    position: absolute;
    z-index: 5;
    left: var(--hs-arrow-left, 50%);
    right: var(--hs-arrow-right, auto);
    bottom: var(--hs-arrow-bottom, clamp(18px, 4vh, 48px));
    width: max(34px, var(--hs-arrow-size, 24px));
    transform: translateX(var(--hs-arrow-translate-x, -50%));
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    opacity: 0;
    transition: opacity 160ms ease;
    pointer-events: none;
}

.hs-hero__scroll-cue[data-hs-active='true'] {
    opacity: .9;
}

.hs-hero__scroll-label {
    display: block;
    color: rgba(255,255,255,.92);
    font-family: Montserrat, sans-serif;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .14em;
    white-space: nowrap;
    transform: translateX(.07em);
}

.hs-hero__scroll-arrow {
    display: block;
    width: var(--hs-arrow-size, 24px);
    height: auto;
    color: rgba(255,255,255,.92);
    animation: hs-scroll-arrow-bounce 1.25s ease-in-out infinite;
}

.hs-hero__scroll-arrow path {
    stroke-width: var(--hs-arrow-stroke, 2.2);
}

@keyframes hs-scroll-arrow-bounce {
    0%, 100% { translate: 0 -4px; }
    50% { translate: 0 5px; }
}

/* Final continuation buttons. */
.hs-hero__continuation {
    z-index: 4;
    display: grid;
    place-items: center;
    padding: clamp(20px, 4vw, 64px);
    pointer-events: none;
}

.hs-hero__continuation[data-hs-active='true'] {
    pointer-events: auto;
}

.hs-hero__continuation-motion {
    position: absolute;
    left: 0;
    right: 0;
    top: var(--hs-cont-top-d, 50%);
    translate: 0 var(--hs-cont-translate-y-d, -50%);
    width: 100%;
    display: grid;
    place-items: center;
    opacity: 0;
    transform-origin: center;
    will-change: opacity, transform;
}

.hs-hero__continuation-cards {
    display: grid;
    grid-template-columns: var(--hs-cont-columns-d, repeat(2, max-content));
    align-items: center;
    justify-items: center;
    justify-content: center;
    row-gap: var(--hs-cont-row-gap-d, 0px);
    column-gap: var(--hs-cont-column-gap-d, 24px);
    max-width: 100%;
    max-height: none;
}

.hs-hero__continuation-card {
    position: relative;
    container-type: inline-size;
    display: block;
    box-sizing: border-box;
    flex: 0 0 auto;
    width: var(--hs-cont-card-width-d, min(32vw, 520px));
    height: var(--hs-cont-card-height-d, min(32vw, 520px));
    overflow: hidden;
    color: #fff;
    background-color: var(--hs-card-enter-background, rgba(0,0,0,.24));
    border: var(--hs-card-enter-outline-width, 1px) solid var(--hs-card-enter-outline-color, rgba(255,255,255,.35));
    border-radius: var(--hs-card-enter-radius-resolved, var(--hs-card-enter-radius, 0px));
    backdrop-filter: blur(var(--hs-card-enter-blur, 16px));
    -webkit-backdrop-filter: blur(var(--hs-card-enter-blur, 16px));
    text-decoration: none;
    isolation: isolate;
    opacity: 0;
    transform: translate3d(var(--hs-card-enter-x, 0px), var(--hs-card-enter-y, 0px), 0) scale(var(--hs-card-enter-scale, 1));
    transition: none;
    transform-origin: center;
}

.hs-hero__continuation[data-hs-active='true'] .hs-hero__continuation-card {
    opacity: 1;
    background-color: var(--hs-card-background, rgba(0,0,0,.24));
    border-color: var(--hs-card-outline-color, rgba(255,255,255,.35));
    border-width: var(--hs-card-outline-width, 1px);
    border-radius: var(--hs-card-radius-resolved, var(--hs-card-radius, 0px));
    backdrop-filter: blur(var(--hs-card-blur, 16px));
    -webkit-backdrop-filter: blur(var(--hs-card-blur, 16px));
    transform: translate3d(0, 0, 0) scale(var(--hs-card-scale, 1));
    transition:
        opacity var(--hs-card-enter-duration, 500ms) ease,
        transform var(--hs-card-enter-duration, 500ms) ease,
        background-color var(--hs-card-enter-duration, 500ms) ease,
        border-color var(--hs-card-enter-duration, 500ms) ease,
        border-width var(--hs-card-enter-duration, 500ms) ease,
        border-radius var(--hs-card-enter-duration, 500ms) ease,
        backdrop-filter var(--hs-card-enter-duration, 500ms) ease,
        -webkit-backdrop-filter var(--hs-card-enter-duration, 500ms) ease;
}

.hs-hero__continuation-card:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 4px;
}

.hs-hero__card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-columns: var(--hs-card-content-columns-d, 1fr);
    grid-template-rows: var(--hs-card-content-rows-d, 35% 1fr);
    min-width: 0;
    min-height: 0;
}

.hs-hero__card-text {
    position: var(--hs-card-text-position-d, relative);
    z-index: 2;
    min-width: 0;
    min-height: 0;
    box-sizing: border-box;
    width: var(--hs-card-main-width-d, 82%);
    margin-top: 0;
    margin-left: var(--hs-card-text-margin-left-d, auto);
    margin-right: var(--hs-card-text-margin-right-d, auto);
    padding-top: var(--hs-card-text-padding-top-d, 10%);
    left: var(--hs-card-text-left-d, auto);
    right: var(--hs-card-text-right-d, auto);
    top: var(--hs-card-text-top-d, auto);
    bottom: var(--hs-card-text-bottom-d, auto);
    transform: translateY(var(--hs-card-text-translate-y-d, 0%));
    display: flex;
    flex-direction: column;
    align-items: stretch;
    --hs-card-line-gap-current: var(--hs-card-line-gap-d, 8%);
    --hs-card-main-percent-current: var(--hs-card-main-percent-d, 82);
    --hs-card-edge-percent-current: var(--hs-card-edge-percent-d, 10);
    gap: 0;
    color: #fff;
}

.hs-hero__card-line {
    margin: 0;
    color: inherit;
    white-space: nowrap;
    text-transform: uppercase;
    line-height: 1;
    text-box-trim: trim-both;
    text-box-edge: cap alphabetic;
}

.hs-hero__card-line--main {
    width: 100%;
    font-family: 'Space Mono', monospace;
    font-weight: 700;
    letter-spacing: 0;
    text-align: left;
}

.hs-hero__card-line--side {
    width: var(--hs-card-side-width-d, 90%);
    align-self: var(--hs-card-side-self-d, center);
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    letter-spacing: .13em;
    text-align: var(--hs-card-align-d, center);
}

.hs-hero__card-media {
    position: relative;
    grid-column: var(--hs-card-media-column-d, 1);
    grid-row: var(--hs-card-media-row-d, 2);
    --hs-card-media-scale-current: var(--hs-card-media-scale-d, 100);
    --hs-card-media-h-align-current: var(--hs-card-media-h-align-d, center);
    --hs-card-media-v-align-current: var(--hs-card-media-v-align-d, center);
    z-index: 1;
    min-width: 0;
    min-height: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.hs-hero__card-canvas {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    margin: 0;
    padding: 0;
    border: 0;
    pointer-events: none;
    user-select: none;
}

@media (hover: hover) and (pointer: fine) {
    .hs-hero__continuation-card[href] { cursor: pointer; }

    .hs-hero__continuation[data-hs-active='true'] .hs-hero__continuation-card:hover {
        background-color: var(--hs-card-hover-background, var(--hs-card-background, rgba(0,0,0,.24)));
        border-color: var(--hs-card-hover-outline-color, var(--hs-card-outline-color, rgba(255,255,255,.35)));
        border-width: var(--hs-card-hover-outline-width, var(--hs-card-outline-width, 1px));
        border-radius: var(--hs-card-hover-radius-resolved, var(--hs-card-hover-radius, var(--hs-card-radius-resolved, var(--hs-card-radius, 0px))));
        backdrop-filter: blur(var(--hs-card-hover-blur, var(--hs-card-blur, 16px)));
        -webkit-backdrop-filter: blur(var(--hs-card-hover-blur, var(--hs-card-blur, 16px)));
        transform: translate3d(0, 0, 0) scale(var(--hs-card-hover-scale, var(--hs-card-scale, 1)));
        transition-duration: var(--hs-card-hover-duration, 220ms);
    }
}

@media (max-width: 1024px) {
    .hs-hero__continuation-motion {
        top: var(--hs-cont-top-t, var(--hs-cont-top-d, 50%));
        translate: 0 var(--hs-cont-translate-y-t, var(--hs-cont-translate-y-d, -50%));
    }

    .hs-hero__beat-content {
        left: var(--hs-left-t, var(--hs-left-d, auto));
        right: var(--hs-right-t, var(--hs-right-d, auto));
        top: var(--hs-top-t, var(--hs-top-d, auto));
        bottom: var(--hs-bottom-t, var(--hs-bottom-d, auto));
        width: var(--hs-main-width-t, var(--hs-main-width-d, 52vw));
        transform: var(--hs-transform-t, var(--hs-transform-d, none));
    }

    .hs-hero__line--side {
        width: var(--hs-side-width-t, var(--hs-side-width-d, 90%));
        align-self: var(--hs-side-self-t, var(--hs-side-self-d, flex-end));
        text-align: var(--hs-side-align-t, var(--hs-side-align-d, right));
    }

    .hs-hero__gradient {
        left: var(--hs-gradient-left-t, var(--hs-gradient-left-d, auto));
        right: var(--hs-gradient-right-t, var(--hs-gradient-right-d, auto));
        top: var(--hs-gradient-top-t, var(--hs-gradient-top-d, auto));
        bottom: var(--hs-gradient-bottom-t, var(--hs-gradient-bottom-d, auto));
        width: var(--hs-gradient-width-t, var(--hs-gradient-width-d, 50vw));
        height: var(--hs-gradient-height-t, var(--hs-gradient-height-d, 100%));
        transform: var(--hs-gradient-transform-t, var(--hs-gradient-transform-d, none));
        background: var(--hs-gradient-background-t, var(--hs-gradient-background-d));
    }

    .hs-hero__logo-content {
        left: var(--hs-logo-left-t, var(--hs-logo-left-d, 50%));
        right: var(--hs-logo-right-t, var(--hs-logo-right-d, auto));
        top: var(--hs-logo-top-offset-t, var(--hs-logo-top-offset-d, 8vh));
        height: max(1px, calc(50vh - var(--hs-logo-top-offset-t, var(--hs-logo-top-offset-d, 8vh)) - var(--hs-logo-center-gap-t, var(--hs-logo-center-gap-d, 8vh))));
        transform: translateX(var(--hs-logo-translate-x-t, var(--hs-logo-translate-x-d, -50%)));
    }

    .hs-hero__logo-content .hs-hero__beat-motion {
        width: auto;
        height: 100%;
    }

    .hs-hero__continuation-cards {
        grid-template-columns: var(--hs-cont-columns-t, var(--hs-cont-columns-d, repeat(2, max-content)));
        row-gap: var(--hs-cont-row-gap-t, var(--hs-cont-row-gap-d, 0px));
        column-gap: var(--hs-cont-column-gap-t, var(--hs-cont-column-gap-d, 20px));
    }

    .hs-hero__continuation-card {
        width: var(--hs-cont-card-width-t, var(--hs-cont-card-width-d, 42vw));
        height: var(--hs-cont-card-height-t, var(--hs-cont-card-height-d, 42vw));
    }

    .hs-hero__card-inner {
        grid-template-columns: var(--hs-card-content-columns-t, var(--hs-card-content-columns-d, 1fr));
        grid-template-rows: var(--hs-card-content-rows-t, var(--hs-card-content-rows-d, 35% 1fr));
    }

    .hs-hero__card-text {
        position: var(--hs-card-text-position-t, var(--hs-card-text-position-d, relative));
        width: var(--hs-card-main-width-t, var(--hs-card-main-width-d, 82%));
        margin-top: 0;
        margin-left: var(--hs-card-text-margin-left-t, var(--hs-card-text-margin-left-d, auto));
        margin-right: var(--hs-card-text-margin-right-t, var(--hs-card-text-margin-right-d, auto));
        padding-top: var(--hs-card-text-padding-top-t, var(--hs-card-text-padding-top-d, 10%));
        left: var(--hs-card-text-left-t, var(--hs-card-text-left-d, auto));
        right: var(--hs-card-text-right-t, var(--hs-card-text-right-d, auto));
        top: var(--hs-card-text-top-t, var(--hs-card-text-top-d, auto));
        bottom: var(--hs-card-text-bottom-t, var(--hs-card-text-bottom-d, auto));
        transform: translateY(var(--hs-card-text-translate-y-t, var(--hs-card-text-translate-y-d, 0%)));
        --hs-card-line-gap-current: var(--hs-card-line-gap-t, var(--hs-card-line-gap-d, 8%));
        --hs-card-main-percent-current: var(--hs-card-main-percent-t, var(--hs-card-main-percent-d, 82));
        --hs-card-edge-percent-current: var(--hs-card-edge-percent-t, var(--hs-card-edge-percent-d, 10));
    }

    .hs-hero__card-media {
        grid-column: var(--hs-card-media-column-t, var(--hs-card-media-column-d, 1));
        grid-row: var(--hs-card-media-row-t, var(--hs-card-media-row-d, 2));
        --hs-card-media-scale-current: var(--hs-card-media-scale-t, var(--hs-card-media-scale-d, 100));
        --hs-card-media-h-align-current: var(--hs-card-media-h-align-t, var(--hs-card-media-h-align-d, center));
        --hs-card-media-v-align-current: var(--hs-card-media-v-align-t, var(--hs-card-media-v-align-d, center));
    }

    .hs-hero__card-line--side {
        width: var(--hs-card-side-width-t, var(--hs-card-side-width-d, 90%));
        align-self: var(--hs-card-side-self-t, var(--hs-card-side-self-d, center));
        text-align: var(--hs-card-align-t, var(--hs-card-align-d, center));
    }
}

@media (max-width: 767px) {
    .hs-hero__sticky {
        height: 100vh;
        height: 100dvh;

        /* Own vertical gestures while the full-screen story is active. This keeps
           iOS Safari from starting native momentum before view.js can snap the
           playhead to one of the authored stops. Horizontal gestures and taps
           remain native. */
        touch-action: pan-x;
        overscroll-behavior-y: none;
    }

    .hs-hero__continuation-motion {
        top: var(--hs-cont-top-m, var(--hs-cont-top-t, var(--hs-cont-top-d, 50%)));
        translate: 0 var(--hs-cont-translate-y-m, var(--hs-cont-translate-y-t, var(--hs-cont-translate-y-d, -50%)));
    }

    .hs-hero__beat-content {
        left: var(--hs-left-m, var(--hs-left-t, var(--hs-left-d, auto)));
        right: var(--hs-right-m, var(--hs-right-t, var(--hs-right-d, auto)));
        top: var(--hs-top-m, var(--hs-top-t, var(--hs-top-d, auto)));
        bottom: var(--hs-bottom-m, var(--hs-bottom-t, var(--hs-bottom-d, auto)));
        width: var(--hs-main-width-m, var(--hs-main-width-t, var(--hs-main-width-d, 86vw)));
        transform: var(--hs-transform-m, var(--hs-transform-t, var(--hs-transform-d, none)));
    }

    .hs-hero__line--side {
        width: var(--hs-side-width-m, var(--hs-side-width-t, var(--hs-side-width-d, 90%)));
        align-self: var(--hs-side-self-m, var(--hs-side-self-t, var(--hs-side-self-d, center)));
        text-align: var(--hs-side-align-m, var(--hs-side-align-t, var(--hs-side-align-d, center)));
    }

    .hs-hero__gradient {
        left: var(--hs-gradient-left-m, var(--hs-gradient-left-t, var(--hs-gradient-left-d, auto)));
        right: var(--hs-gradient-right-m, var(--hs-gradient-right-t, var(--hs-gradient-right-d, auto)));
        top: var(--hs-gradient-top-m, var(--hs-gradient-top-t, var(--hs-gradient-top-d, auto)));
        bottom: var(--hs-gradient-bottom-m, var(--hs-gradient-bottom-t, var(--hs-gradient-bottom-d, auto)));
        width: var(--hs-gradient-width-m, var(--hs-gradient-width-t, var(--hs-gradient-width-d, 50vw)));
        height: var(--hs-gradient-height-m, var(--hs-gradient-height-t, var(--hs-gradient-height-d, 100%)));
        transform: var(--hs-gradient-transform-m, var(--hs-gradient-transform-t, var(--hs-gradient-transform-d, none)));
        background: var(--hs-gradient-background-m, var(--hs-gradient-background-t, var(--hs-gradient-background-d)));
    }

    .hs-hero__logo-content {
        left: var(--hs-logo-left-m, var(--hs-logo-left-t, var(--hs-logo-left-d, 50%)));
        right: var(--hs-logo-right-m, var(--hs-logo-right-t, var(--hs-logo-right-d, auto)));
        top: var(--hs-logo-top-offset-m, var(--hs-logo-top-offset-t, var(--hs-logo-top-offset-d, 7vh)));
        height: max(1px, calc(50vh - var(--hs-logo-top-offset-m, var(--hs-logo-top-offset-t, var(--hs-logo-top-offset-d, 7vh))) - var(--hs-logo-center-gap-m, var(--hs-logo-center-gap-t, var(--hs-logo-center-gap-d, 7vh)))));
        transform: translateX(var(--hs-logo-translate-x-m, var(--hs-logo-translate-x-t, var(--hs-logo-translate-x-d, -50%))));
    }

    .hs-hero__logo-content .hs-hero__beat-motion {
        width: auto;
        height: 100%;
    }

    .hs-hero__continuation {
        padding: 18px;
        overflow: hidden;
    }

    .hs-hero__continuation-cards {
        grid-template-columns: var(--hs-cont-columns-m, var(--hs-cont-columns-t, var(--hs-cont-columns-d, max-content)));
        row-gap: var(--hs-cont-row-gap-m, var(--hs-cont-row-gap-t, var(--hs-cont-row-gap-d, 18px)));
        column-gap: var(--hs-cont-column-gap-m, var(--hs-cont-column-gap-t, var(--hs-cont-column-gap-d, 0px)));
        justify-content: center;
        padding: 10px 0;
    }

    .hs-hero__continuation-card {
        width: var(--hs-cont-card-width-m, var(--hs-cont-card-width-t, var(--hs-cont-card-width-d, 86vw)));
        height: var(--hs-cont-card-height-m, var(--hs-cont-card-height-t, var(--hs-cont-card-height-d, 86vw)));
    }

    .hs-hero__card-inner {
        grid-template-columns: var(--hs-card-content-columns-m, var(--hs-card-content-columns-t, var(--hs-card-content-columns-d, 1fr)));
        grid-template-rows: var(--hs-card-content-rows-m, var(--hs-card-content-rows-t, var(--hs-card-content-rows-d, 35% 1fr)));
    }

    .hs-hero__card-text {
        position: var(--hs-card-text-position-m, var(--hs-card-text-position-t, var(--hs-card-text-position-d, relative)));
        width: var(--hs-card-main-width-m, var(--hs-card-main-width-t, var(--hs-card-main-width-d, 82%)));
        margin-top: 0;
        margin-left: var(--hs-card-text-margin-left-m, var(--hs-card-text-margin-left-t, var(--hs-card-text-margin-left-d, auto)));
        margin-right: var(--hs-card-text-margin-right-m, var(--hs-card-text-margin-right-t, var(--hs-card-text-margin-right-d, auto)));
        padding-top: var(--hs-card-text-padding-top-m, var(--hs-card-text-padding-top-t, var(--hs-card-text-padding-top-d, 10%)));
        left: var(--hs-card-text-left-m, var(--hs-card-text-left-t, var(--hs-card-text-left-d, auto)));
        right: var(--hs-card-text-right-m, var(--hs-card-text-right-t, var(--hs-card-text-right-d, auto)));
        top: var(--hs-card-text-top-m, var(--hs-card-text-top-t, var(--hs-card-text-top-d, auto)));
        bottom: var(--hs-card-text-bottom-m, var(--hs-card-text-bottom-t, var(--hs-card-text-bottom-d, auto)));
        transform: translateY(var(--hs-card-text-translate-y-m, var(--hs-card-text-translate-y-t, var(--hs-card-text-translate-y-d, 0%))));
        --hs-card-line-gap-current: var(--hs-card-line-gap-m, var(--hs-card-line-gap-t, var(--hs-card-line-gap-d, 8%)));
        --hs-card-main-percent-current: var(--hs-card-main-percent-m, var(--hs-card-main-percent-t, var(--hs-card-main-percent-d, 82)));
        --hs-card-edge-percent-current: var(--hs-card-edge-percent-m, var(--hs-card-edge-percent-t, var(--hs-card-edge-percent-d, 10)));
    }

    .hs-hero__card-media {
        grid-column: var(--hs-card-media-column-m, var(--hs-card-media-column-t, var(--hs-card-media-column-d, 1)));
        grid-row: var(--hs-card-media-row-m, var(--hs-card-media-row-t, var(--hs-card-media-row-d, 2)));
        --hs-card-media-scale-current: var(--hs-card-media-scale-m, var(--hs-card-media-scale-t, var(--hs-card-media-scale-d, 100)));
        --hs-card-media-h-align-current: var(--hs-card-media-h-align-m, var(--hs-card-media-h-align-t, var(--hs-card-media-h-align-d, center)));
        --hs-card-media-v-align-current: var(--hs-card-media-v-align-m, var(--hs-card-media-v-align-t, var(--hs-card-media-v-align-d, center)));
    }

    .hs-hero__card-line--side {
        width: var(--hs-card-side-width-m, var(--hs-card-side-width-t, var(--hs-card-side-width-d, 90%)));
        align-self: var(--hs-card-side-self-m, var(--hs-card-side-self-t, var(--hs-card-side-self-d, center)));
        text-align: var(--hs-card-align-m, var(--hs-card-align-t, var(--hs-card-align-d, center)));
    }
}

@media (prefers-reduced-motion: reduce) {
    .hs-hero__scroll-arrow {
        animation: none;
    }

    .hs-hero__continuation-card {
        transition: none;
    }
}