.bcc-bp {
    --bp-title-on: var(--text-body-lg);
    --bp-title-off: var(--text-body-lg);
    --bp-ink-off: var(--color-grey-80);
    --bp-list-floor: calc(250px + 1.25*max(0px, 349px - (100vw - 48px)));
    position: relative
}

.bcc-bp-screen {
    display: flex;
    align-items: center;
    min-height: 100svh;
    min-height: 100dvh;
    padding: 16px 24px
}

.bcc-bp-grid {
    display: grid;
    grid-template-areas: "card" "copy";
    row-gap: 14px;
    width: 100%;
    max-width: 349px;
    margin-inline: auto
}

.bcc-bp-card {
    grid-area: card;
    position: relative;
    width: 100%;
    height: auto;
    aspect-ratio: 342 / 336;
    max-height: clamp(150px, calc(100svh - 36px - 14px - 60px - 12px - var(--bp-list-floor) - 16px - 110px), 349px);
    border-radius: var(--radius-lg);
    overflow: hidden
}

.bcc-bp-img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.bcc-bp-img:not(:first-child) {
    opacity: 0
}

@media(max-width:767.9px) {
    .bcc-bp-img[data-shot=battery] {
        object-position: 50% 34%
    }
    .bcc-bp-img[data-shot=install] {
        object-position: 50% 28%
    }
    .bcc-bp-img[data-shot=winter] {
        object-position: 50% 38%
    }
}

.bcc-bp-copy {
    grid-area: copy;
    display: flex;
    flex-direction: column
}

.bcc-bp-head {
    margin: 0;
    font-size: var(--text-headline-sm);
    font-weight: 600;
    line-height: var(--text-headline-sm--line-height);
    letter-spacing: var(--text-headline-sm--letter-spacing);
    color: var(--color-green-90)
}

.bcc-bp-line {
    display: block
}

.bcc-bp-mark {
    position: relative;
    display: inline-block
}

.bcc-bp-stroke {
    position: absolute;
    left: -1%;
    bottom: .115em;
    z-index: -1;
    width: 104%;
    height: .115em
}

.bcc-bp-list {
    position: relative;
    display: grid;
    grid-template-rows: repeat(3, auto) min-content;
    min-height: var(--bp-list-floor);
    margin: 12px 0 0;
    padding: 0;
    list-style: none
}

.bcc-bp-list:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 6px;
    border-radius: var(--radius-sm);
    background: var(--color-grey-20)
}

.bcc-bp-step {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding-left: 19px
}

.bcc-bp-seg {
    position: absolute;
    top: 0;
    bottom: -1px;
    left: 0;
    width: 6px
}

.bcc-bp-step:first-child .bcc-bp-seg {
    border-radius: var(--radius-sm) var(--radius-sm) 0 0
}

.bcc-bp-step:last-child .bcc-bp-seg {
    bottom: 0;
    border-radius: 0 0 var(--radius-sm) var(--radius-sm)
}

.bcc-bp-seg:after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: var(--color-orange-60);
    transform-origin: top center
}

.bcc-bp-ico {
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    color: var(--color-green-90)
}

.bcc-bp-ico svg {
    display: block;
    width: 100%;
    height: 100%
}

.bcc-bp-text {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0
}

.bcc-bp-title {
    margin: 0;
    font-size: var(--bp-title-on);
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: .2px;
    color: var(--color-green-90)
}

.bcc-bp-clip {
    display: grid;
    grid-template-rows: 1fr
}

.bcc-bp-body {
    margin: 0;
    min-height: 0;
    overflow: hidden;
    font-size: var(--text-body-md);
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: .2px;
    text-wrap: pretty;
    color: var(--color-grey-100)
}

.bcc-bp-body strong {
    font-weight: 600
}

.bcc-bp-body:after {
    content: "";
    display: block;
    height: 18px
}

.bcc-bp-cta {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 16px
}

@media(min-width:768px) {
    .bcc-bp {
        --bp-title-on: var(--text-heading-sm);
        --bp-title-off: var(--text-body-lg)
    }
    .bcc-bp-screen {
        padding: clamp(40px, 9svh, 88px) clamp(28px, 4.86vw, 70px)
    }
    .bcc-bp-grid {
        grid-template-areas: "copy card";
        grid-template-columns: minmax(0, 520fr) minmax(0, 676fr);
        column-gap: clamp(44px, 7.2vw, 104px);
        align-items: center;
        row-gap: 0;
        max-width: 1300px
    }
    .bcc-bp-card {
        height: auto;
        aspect-ratio: 676 / 665;
        max-height: calc(100svh - clamp(80px, 18svh, 176px))
    }
    .bcc-bp-head {
        font-size: var(--text-headline-md)
    }
    .bcc-bp-list {
        min-height: 412px;
        margin-top: 18px
    }
    .bcc-bp-body {
        font-size: var(--text-body-lg)
    }
    .bcc-bp-body:after {
        height: 22px
    }
    .bcc-bp-cta {
        flex-direction: row;
        gap: 32px;
        margin-top: 56px
    }
}

@media(min-width:768px)and (max-width:1023.9px) {
    .bcc-bp {
        --bp-title-on: var(--text-body-lg)
    }
    .bcc-bp-cta {
        flex-direction: column;
        gap: 10px;
        margin-top: 32px
    }
}

.bcc-x .bcc-bp {
    --bp-h: 520svh;
    height: var(--bp-h)
}

.bcc-x .bcc-bp-screen {
    position: sticky;
    top: 0;
    height: 100svh;
    height: 100dvh;
    min-height: 0;
    border-top: var(--bcc-nav-h) solid transparent
}

@media(min-width:768px) {
    .bcc-x .bcc-bp {
        --bp-h: 460svh
    }
}

.bcc-bp-stop {
    position: absolute;
    left: 0;
    width: 1px;
    height: 1px;
    pointer-events: none
}

.bcc-x .bcc-bp-stop {
    top: calc(var(--at, 0) * (var(--bp-h) - 100svh))
}

html.bcc-snap .bcc-x .bcc-bp-stop {
    scroll-snap-align: start;
    scroll-snap-stop: always
}

.bcc-x .bcc-bp-stop-seam {
    top: -100svh
}

html.bcc-snap .bcc-x .bcc-bp-stop-out {
    scroll-snap-stop: normal
}

.bcc-x .bcc-bp-stop-back {
    top: -150svh
}

.bcc-x .bcc-bp-stop-on {
    top: calc(var(--bp-h) - 50svh)
}

.bcc-x .bcc-bp-stroke {
    clip-path: inset(0 100% 0 0);
    transition: clip-path .8s var(--bcc-ease-settle) .18s
}

.bcc-x .bcc-bp-head.bcc-in .bcc-bp-stroke {
    clip-path: inset(0 0 0 0)
}

.bcc-x .bcc-bp-list.bcc-in~.bcc-bp-cta {
    opacity: 1;
    transform: none
}

.bcc-x .bcc-bp-img:not(:first-child) {
    --wd: .1;
    --w: clamp(0, calc((var(--sp, 0) - var(--wb, 0) + var(--wd) / 2) / var(--wd)), 1);
    --wo: calc(var(--w) * (2 - var(--w)));
    opacity: var(--w);
    transform: scale(calc(1.05 - .05 * var(--wo)))
}

.bcc-x .bcc-bp-seg:after {
    transform: scaleY(clamp(0, calc((var(--sp, 0) * var(--n) - var(--i)) / .4), 1))
}

.bcc-x .bcc-bp-title {
    font-size: var(--ts, var(--bp-title-off));
    color: var(--ink, var(--bp-ink-off));
    transition: font-size .48s var(--bcc-ease-settle), color .32s var(--bcc-ease-settle)
}

.bcc-x .bcc-bp-ico {
    color: var(--ink, var(--bp-ink-off));
    transition: color .32s var(--bcc-ease-settle)
}

.bcc-x .bcc-bp-clip {
    grid-template-rows: var(--rows, 0fr);
    transition: grid-template-rows .48s var(--bcc-ease-settle)
}

.bcc-x .bcc-bp-body {
    opacity: var(--on, 0);
    transition: opacity .24s var(--bcc-ease-settle)
}

.bcc-x .bcc-bp[data-bcc-step="0"] .bcc-bp-step:nth-child(1),
.bcc-x .bcc-bp[data-bcc-step="1"] .bcc-bp-step:nth-child(2),
.bcc-x .bcc-bp[data-bcc-step="2"] .bcc-bp-step:nth-child(3),
.bcc-x .bcc-bp[data-bcc-step="3"] .bcc-bp-step:nth-child(4) {
    --on: 1;
    --rows: 1fr;
    --ink: var(--color-green-90);
    --ts: var(--bp-title-on)
}

.bcc-x .bcc-bp[data-bcc-step="0"] .bcc-bp-step:nth-child(1) .bcc-bp-body,
.bcc-x .bcc-bp[data-bcc-step="1"] .bcc-bp-step:nth-child(2) .bcc-bp-body,
.bcc-x .bcc-bp[data-bcc-step="2"] .bcc-bp-step:nth-child(3) .bcc-bp-body,
.bcc-x .bcc-bp[data-bcc-step="3"] .bcc-bp-step:nth-child(4) .bcc-bp-body {
    transition-delay: .16s
}

.bcc-x .bcc-bp[data-bcc-live] .bcc-bp-img,
.bcc-x .bcc-bp[data-bcc-live] .bcc-bp-seg:after {
    will-change: transform
}

@media(prefers-reduced-motion:reduce) {
    .bcc-bp-btn {
        transition: none
    }
}

@media(max-width:767.9px) {
    .bcc-x .bcc-bp-stop {
        scroll-snap-align: none
    }
    .bcc-x .bcc-bp-seg:after {
        transform: scaleY(clamp(0, calc((var(--sp, 0) * var(--n) - var(--i)) / .2), 1))
    }
}

@media(max-width:767.9px)and (min-height:600.1px) {
    .bcc-x .bcc-bp-img:not(:first-child) {
        --w: 0;
        opacity: 0;
        transform: none;
        transition: opacity .45s var(--bcc-ease-settle)
    }
    .bcc-x .bcc-bp[data-bcc-step="1"] .bcc-bp-img[data-shot=install],
    .bcc-x .bcc-bp[data-bcc-step="2"] .bcc-bp-img[data-shot=winter],
    .bcc-x .bcc-bp[data-bcc-step="3"] .bcc-bp-img[data-shot=hand] {
        opacity: 1
    }
}

@media(min-width:768px)and (max-height:720px),
(max-width:767.9px)and (max-height:600px) {
    .bcc-x .bcc-bp {
        height: auto
    }
    .bcc-x .bcc-bp-screen {
        position: static;
        height: auto;
        min-height: 100svh;
        min-height: 100dvh;
        border-top-width: 0
    }
    .bcc-x .bcc-bp :is(.bcc-bp-head, .bcc-bp-stroke, .bcc-bp-card, .bcc-bp-list, .bcc-bp-cta) {
        opacity: 1;
        filter: none;
        clip-path: none;
        transform: none
    }
    .bcc-x .bcc-bp-stop {
        scroll-snap-align: none
    }
    .bcc-x .bcc-bp-title {
        font-size: var(--bp-title-on)
    }
    .bcc-x .bcc-bp-title,
    .bcc-x .bcc-bp-ico {
        color: var(--color-green-90)
    }
    .bcc-x .bcc-bp-clip {
        grid-template-rows: 1fr
    }
    .bcc-x .bcc-bp-body {
        opacity: 1
    }
    .bcc-x .bcc-bp-seg:after {
        transform: none
    }
    .bcc-x .bcc-bp-img:not(:first-child) {
        opacity: 0;
        transform: none
    }
}

.bcc-crew {
    position: relative
}

.bcc-crew-screen {
    --crew-pad-x: clamp(20px, 6.6vw, 85px);
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    min-height: 100svh;
    min-height: 100dvh;
    overflow-x: clip;
    padding: 44px var(--crew-pad-x) max(32px, calc(env(safe-area-inset-bottom, 0px) + 20px))
}

.bcc-crew-head,
.bcc-crew-cta {
    position: relative;
    z-index: 2
}

.bcc-crew-head {
    max-width: 342px;
    margin: 0;
    font-size: var(--text-heading-md);
    font-weight: 600;
    line-height: var(--text-heading-md--line-height);
    letter-spacing: var(--text-heading-md--letter-spacing);
    text-wrap: balance;
    color: var(--color-grey-100)
}

@media(min-width:991px) {
    .bcc-crew-head {
        font-size: var(--text-heading-lg);
        line-height: var(--text-heading-lg--line-height);
        letter-spacing: var(--text-heading-lg--letter-spacing)
    }
}

.bcc-crew-mark {
    position: relative;
    display: inline-block;
    white-space: nowrap
}

.bcc-crew-stroke {
    position: absolute;
    left: -1%;
    bottom: .02em;
    z-index: -1;
    width: 102%;
    height: .11em
}

.bcc-crew-cta {
    width: 100%
}

.bcc-crew-m {
    display: none
}

.bcc-crew-stage {
    --crew-box: 120vw;
    --crew-box-min: 104.7vw;
    position: relative;
    z-index: 1;
    flex: 1 1 0;
    align-self: stretch;
    margin: 16px calc(-1 * var(--crew-pad-x)) 32px;
    min-height: calc(var(--crew-box-min) * .974);
    max-height: calc(var(--crew-box) * .974)
}

.bcc-crew-collage {
    position: absolute;
    z-index: 1;
    left: 27.85%;
    bottom: 0;
    width: auto;
    height: 112.24%;
    max-height: calc(var(--crew-box) * 1.0932);
    aspect-ratio: 816.83 / 892.92;
    transform: translate(-27.85%)
}

.bcc-crew-piece {
    position: absolute;
    left: var(--cx);
    top: var(--cy);
    width: var(--cw);
    aspect-ratio: var(--ca);
    transform: translate(-50%, -50%)
}

.bcc-crew-art {
    position: relative;
    width: 100%;
    height: 100%;
    transform: rotate(var(--cr))
}

.bcc-crew-art>img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.bcc-crew-art>.bcc-crew-inphoto {
    inset: auto;
    left: calc(50% + var(--px, 0%));
    top: calc(50% + var(--py, 0%));
    width: var(--pw);
    height: var(--ph);
    transform: translate(-50%, -50%)
}

.bcc-crew-frame {
    z-index: 1;
    object-fit: fill
}

.bcc-crew-card {
    background: var(--color-white)
}

.bcc-crew-shop {
    --cx: 17.43%;
    --cy: 40.04%;
    --cw: 32.36%;
    --ca: 264.326 / 220.053;
    --cr: 5.66deg
}

.bcc-crew-robots {
    --cx: 43.77%;
    --cy: 37.88%;
    --cw: 40.11%;
    --ca: 327.651 / 359.779;
    --cr: -2.93deg;
    --pw: 94.77%;
    --ph: 95.16%;
    --px: -.22%;
    --py: .08%
}

.bcc-crew-group {
    --cx: 24.61%;
    --cy: 76.82%;
    --cw: 42.15%;
    --ca: 344.321 / 410.21;
    --cr: .62deg;
    --pw: 90.61%;
    --ph: 85.71%;
    --px: -.07%;
    --py: -3.13%
}

.bcc-crew-tape-a {
    --cx: 43.17%;
    --cy: 16.86%;
    --cw: 25.27%;
    --ca: 206.438 / 252.675;
    --cr: -118.07deg
}

.bcc-crew-bench {
    --cx: 81.04%;
    --cy: 40.06%;
    --cw: 29.21%;
    --ca: 238.568 / 329.211;
    --cr: 4.61deg
}

.bcc-crew-battery {
    --cx: 67.24%;
    --cy: 65.71%;
    --cw: 40.11%;
    --ca: 327.651 / 359.779;
    --cr: 5.68deg;
    --pw: 96.32%;
    --ph: 96.66%;
    --px: -1%;
    --py: -.91%
}

.bcc-crew-tape-b {
    --cx: 82.63%;
    --cy: 83.67%;
    --cw: 31.96%;
    --ca: 261.063 / 143.979;
    --cr: 167.69deg
}

@media(max-width:767.9px) {
    .bcc-crew-d {
        display: none
    }
    .bcc-crew-m {
        display: inline
    }
}

@media(min-width:768px) {
    .bcc-crew-screen {
        justify-content: center;
        gap: 40px;
        padding-block: 100px 64px
    }
    .bcc-crew-stage {
        position: absolute;
        inset: 0;
        margin: 0;
        min-height: 0;
        max-height: none
    }
    .bcc-crew-collage {
        inset: 42% .4% auto auto;
        width: clamp(520px, 56.72vw, 940px);
        height: auto;
        max-height: none;
        transform: translateY(-50%)
    }
    .bcc-crew-head {
        max-width: 476px
    }
    .bcc-crew-cta {
        width: auto
    }
}

@media(min-width:768px)and (max-width:1023.9px) {
    .bcc-crew-collage {
        top: 54%;
        width: min(56.72vw, 940px)
    }
    .bcc-crew-head {
        max-width: 400px
    }
}

.bcc-crew-piece {
    --wd: .085;
    --dy: -24px;
    --dr: 5deg;
    --ds: .06
}

.bcc-x .bcc-crew-piece {
    opacity: var(--w);
    transform: translate(-50%, -50%) translateY(calc((1 - var(--wo)) * var(--dy))) rotate(calc((1 - var(--wo)) * var(--dr))) scale(calc(1 + (1 - var(--wo)) * var(--ds)))
}

.bcc-x .bcc-crew[data-bcc-live] .bcc-crew-piece {
    will-change: transform
}

.bcc-crew-shop {
    --ws: .24;
    --dr: -7deg;
    --dy: -26px
}

.bcc-crew-robots {
    --ws: .275;
    --dr: 6deg;
    --dy: -30px
}

.bcc-crew-tape-a {
    --ws: .315;
    --dr: -12deg;
    --dy: 0px;
    --ds: .12
}

.bcc-crew-group {
    --ws: .34;
    --dr: 4deg;
    --dy: -34px
}

.bcc-crew-bench {
    --ws: .375;
    --dr: -6deg;
    --dy: -24px
}

.bcc-crew-battery {
    --ws: .41;
    --dr: 7deg;
    --dy: -30px
}

.bcc-crew-tape-b {
    --ws: .455;
    --dr: 10deg;
    --dy: 0px;
    --ds: .12
}

.bcc-crew-stroke {
    --ws: .12;
    --wd: .18
}

.bcc-x .bcc-crew-stroke {
    clip-path: inset(0 calc((1 - var(--wo)) * 100%) 0 0)
}

.bcc-crew-cta {
    --ws: .44;
    --wd: .1
}

.bcc-x .bcc-crew-cta {
    opacity: var(--w);
    transform: translateY(calc((1 - var(--wo)) * 18px))
}

.bcc-x .bcc-crew .bcc-crew-cta:focus-visible {
    --w: 1;
    --wo: 1
}

.bcc-fact {
    position: relative
}

.bcc-fact-screen {
    --bcc-fact-gut: 24px;
    --bcc-fact-x: var(--bcc-fact-gut);
    --bcc-fact-y: var(--bcc-fact-gut);
    position: relative;
    min-height: 100svh;
    min-height: 100dvh
}

.bcc-fact-box {
    position: absolute;
    inset: 0;
    overflow: hidden;
    background: var(--color-green-100)
}

.bcc-fact-media {
    position: absolute;
    inset: 0
}

.bcc-fact-media :is(img, video) {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center
}

.bcc-fact-video {
    opacity: 0;
    transition: opacity .6s ease
}

.bcc-fact-video.bcc-fact-video-on {
    opacity: 1
}

.bcc-fact-controls {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    transform: translate(var(--bcc-fact-x), calc(-1 * var(--bcc-fact-y)))
}

.bcc-fact-pill,
.bcc-fact-replay,
.bcc-fact-fs {
    display: inline-flex;
    flex: none;
    align-items: center;
    height: 44px;
    margin: 0;
    border: 0;
    background: var(--color-grey-100);
    color: var(--color-white);
    cursor: pointer;
    transition: background-color .15s ease
}

.bcc-fact-pill {
    gap: 9px;
    padding: 0 20px 0 16px;
    border-radius: var(--radius);
    font-family: inherit;
    font-size: var(--text-body-lg);
    font-weight: 600;
    line-height: 1;
    white-space: nowrap
}

.bcc-fact-replay,
.bcc-fact-fs {
    position: relative;
    justify-content: center;
    width: 44px;
    padding: 0;
    border-radius: var(--radius-full)
}

:is(.bcc-fact-pill, .bcc-fact-replay, .bcc-fact-fs):hover {
    background: var(--color-grey-80)
}

:is(.bcc-fact-pill, .bcc-fact-replay, .bcc-fact-fs):focus-visible {
    outline: 2px solid var(--color-white);
    outline-offset: 3px
}

.bcc-fact-fs {
    display: none
}

@media(orientation:portrait) {
    .bcc-fact-fs.bcc-fact-fs-ok {
        display: inline-flex
    }
}

.bcc-fact-fs-ico {
    width: 19px;
    height: 19px
}

.bcc-fact-video:fullscreen {
    object-fit: contain;
    pointer-events: auto
}

.bcc-fact-pill-ico {
    flex: none;
    width: 18px;
    height: 18px
}

.bcc-fact-pill[aria-pressed=false] .bcc-fact-ico-on,
.bcc-fact-pill[aria-pressed=true] .bcc-fact-ico-off {
    display: none
}

.bcc-fact-ring {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none
}

.bcc-fact-ring circle {
    fill: none;
    stroke-width: 2;
    stroke-linecap: butt
}

.bcc-fact-ring-bg {
    stroke: color-mix(in srgb, var(--color-white) 16%, transparent)
}

.bcc-fact-ring-fg {
    stroke: color-mix(in srgb, var(--color-white) 85%, transparent);
    stroke-dasharray: 100px;
    stroke-dashoffset: calc(100px - 100px * var(--bcc-prog, 0));
    transition: stroke-dashoffset .3s linear
}

.bcc-fact-replay-ico {
    position: relative;
    width: 19px;
    height: 19px
}

@keyframes bcc-fact-rewind {
    to {
        transform: rotate(-360deg)
    }
}

.bcc-fact-replay-spin .bcc-fact-replay-ico {
    animation: bcc-fact-rewind .5s var(--bcc-ease-settle)
}

@media(prefers-reduced-motion:reduce) {
    .bcc-fact-replay-spin .bcc-fact-replay-ico {
        animation: none
    }
}

.bcc-fact:focus {
    outline: none
}

.bcc-x .bcc-fact {
    height: 240svh
}

.bcc-x .bcc-fact-screen {
    --sf: clamp(0, min(calc(var(--sp, 0) / .4), calc((1 - var(--sp, 0)) / .4)), 1);
    --sfe: calc(var(--sf) * var(--sf) * (3 - 2 * var(--sf)));
    --bcc-fact-rest: .86;
    --bcc-fact-grow: .17;
    --bcc-fact-x: max( var(--bcc-fact-gut), calc(var(--bcc-fact-gut) + (1 - (var(--bcc-fact-rest) + var(--bcc-fact-grow) * var(--sfe))) / 2 * 100vw));
    --bcc-fact-y: max( var(--bcc-fact-gut), calc(var(--bcc-fact-gut) + (1 - (var(--bcc-fact-rest) + var(--bcc-fact-grow) * var(--sfe))) / 2 * 100svh));
    --bcc-fact-y: max( var(--bcc-fact-gut), calc(var(--bcc-fact-gut) + (1 - (var(--bcc-fact-rest) + var(--bcc-fact-grow) * var(--sfe))) / 2 * 100dvh));
    position: sticky;
    top: 0;
    height: 100svh;
    height: 100dvh;
    min-height: 0;
    overflow: hidden
}

.bcc-x .bcc-fact-box {
    border-radius: var(--radius-2xl);
    transform: scale(calc(var(--bcc-fact-rest) + var(--bcc-fact-grow) * var(--sfe)))
}

.bcc-x .bcc-fact-media {
    transform: scale(calc(1 + .04 * var(--sf)))
}

.bcc-x .bcc-fact[data-bcc-live] :is(.bcc-fact-box, .bcc-fact-media) {
    will-change: transform
}

@media(max-width:767.9px) {
    .bcc-fact-screen {
        --bcc-fact-gut: 14px
    }
    .bcc-fact-controls {
        gap: 8px
    }
    .bcc-fact-pill,
    .bcc-fact-replay,
    .bcc-fact-fs {
        height: 38px
    }
    .bcc-fact-pill {
        gap: 7px;
        padding: 0 16px 0 13px;
        font-size: var(--text-body-md)
    }
    .bcc-fact-pill-ico {
        width: 16px;
        height: 16px
    }
    .bcc-fact-replay,
    .bcc-fact-fs {
        width: 38px
    }
    .bcc-fact-replay-ico,
    .bcc-fact-fs-ico {
        width: 17px;
        height: 17px
    }
    .bcc-x .bcc-fact-screen {
        --bcc-fact-rest: .88;
        --bcc-fact-grow: .15
    }
    .bcc-x .bcc-fact-box {
        border-radius: var(--radius-lg)
    }
}

.bcc-fact-pip {
    position: fixed;
    z-index: 60;
    overflow: hidden;
    visibility: hidden;
    border-radius: var(--radius-md);
    background: var(--color-green-100);
    box-shadow: var(--bpc-shadow-floating);
    opacity: 0;
    outline: none;
    touch-action: none;
    user-select: none
}

.bcc-fact-pip.bcc-pip-on {
    visibility: visible;
    opacity: 1
}

.bcc-fact-pip.bcc-pip-anim {
    transition: left .5s var(--bcc-ease-settle), top .5s var(--bcc-ease-settle), width .5s var(--bcc-ease-settle), height .5s var(--bcc-ease-settle), opacity .24s ease
}

.bcc-fact-pip.bcc-pip-closing {
    opacity: 0
}

.bcc-fact-pip video {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none
}

.bcc-pip-btn {
    position: absolute;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: var(--radius-full);
    background: color-mix(in srgb, var(--color-black) 55%, transparent);
    color: var(--color-white);
    cursor: pointer;
    opacity: 0;
    transition: opacity .2s ease, background-color .15s ease
}

.bcc-fact-pip:hover .bcc-pip-btn,
.bcc-fact-pip.bcc-pip-controls .bcc-pip-btn,
.bcc-pip-btn:focus-visible {
    opacity: 1
}

.bcc-pip-replay {
    display: none
}

.bcc-fact-pip.bcc-pip-seen .bcc-pip-replay {
    display: flex
}

.bcc-fact-pip.bcc-pip-tucked .bcc-pip-btn,
.bcc-fact-pip.bcc-pip-morphing .bcc-pip-btn {
    display: none
}

.bcc-pip-btn:hover {
    background: color-mix(in srgb, var(--color-black) 75%, transparent)
}

.bcc-pip-btn:focus-visible {
    outline: 2px solid var(--color-white);
    outline-offset: 2px
}

.bcc-pip-btn svg {
    width: 55%;
    height: 55%
}

.bcc-pip-pause {
    top: 50%;
    left: 50%;
    width: 54px;
    height: 54px;
    translate: -50% -50%
}

.bcc-pip-replay {
    top: 50%;
    left: 50%;
    width: 44px;
    height: 44px;
    translate: calc(-50% - 63px) -50%
}

.bcc-pip-close {
    top: 10px;
    right: 10px;
    width: 32px;
    height: 32px
}

.bcc-pip-tab {
    position: absolute;
    top: 50%;
    z-index: 2;
    display: none;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 60px;
    padding: 0;
    border: 0;
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--color-black) 55%, transparent);
    color: var(--color-white);
    cursor: pointer;
    translate: 0 -50%
}

.bcc-fact-pip.bcc-pip-tucked .bcc-pip-tab {
    display: flex
}

.bcc-pip-tab svg {
    width: 20px;
    height: 20px
}

.bcc-fact-pip.bcc-pip-tucked-l .bcc-pip-tab {
    right: 4px
}

.bcc-fact-pip.bcc-pip-tucked-r .bcc-pip-tab {
    left: 4px
}

.bcc-fact-pip.bcc-pip-tucked-r .bcc-pip-tab svg {
    transform: rotate(180deg)
}

.bcc-hero-videocard.bcc-pip-holder {
    visibility: hidden
}

.bcc-faq {
    interpolate-size: allow-keywords;
    position: relative;
    padding: 28px var(--bcc-gutter) 72px
}

.bcc-faq-inner {
    width: 100%;
    max-width: var(--bcc-column);
    margin-inline: auto
}

.bcc-faq-tape {
    display: flex
}

.bcc-faq-head {
    position: relative;
    display: inline-block;
    margin: 8px 0 0;
    font-size: var(--text-heading-md);
    font-weight: 600;
    line-height: var(--text-heading-md--line-height);
    letter-spacing: var(--text-heading-md--letter-spacing);
    text-wrap: balance;
    color: var(--color-green-90)
}

@media(min-width:991px) {
    .bcc-faq-head {
        font-size: var(--text-heading-lg);
        line-height: var(--text-heading-lg--line-height);
        letter-spacing: var(--text-heading-lg--letter-spacing)
    }
}

.bcc-faq-stroke {
    position: absolute;
    left: 0;
    bottom: -.02em;
    z-index: -1;
    width: 100%;
    height: .13em
}

.bcc-faq-title {
    position: sticky;
    top: var(--bcc-nav-h, 0px);
    z-index: 2;
    padding-bottom: 10px;
    background: var(--bcc-paper);
    transition: top .35s var(--bcc-ease-settle)
}

.bcc-faq-title:after {
    content: "";
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    height: 44px;
    background: linear-gradient(var(--bcc-paper), transparent);
    pointer-events: none
}

.bcc-faq-list {
    margin-top: 24px
}

.bcc-faq-row {
    border-bottom: 1px solid var(--color-grey-20)
}

.bcc-faq-q {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 20px 0;
    cursor: pointer;
    font-size: var(--text-body-lg);
    font-weight: 600;
    line-height: var(--text-body-lg--line-height);
    letter-spacing: var(--text-body-lg--letter-spacing);
    color: var(--color-grey-100);
    list-style: none
}

.bcc-faq-q::-webkit-details-marker {
    display: none
}

.bcc-faq-q>span {
    flex: 1
}

.bcc-faq-q:focus-visible {
    outline: 2px solid var(--color-green-90);
    outline-offset: 2px
}

.bcc-faq-chev {
    flex: none;
    width: 24px;
    height: 24px;
    color: var(--color-grey-100);
    transition: rotate .2s var(--bcc-ease-settle)
}

.bcc-faq-row[open] .bcc-faq-chev {
    rotate: 180deg
}

.bcc-faq-a {
    padding-bottom: 24px
}

.bcc-faq-a p {
    margin: 0 0 1em;
    max-width: 700px;
    font-weight: 500;
    color: var(--color-grey-80)
}

.bcc-faq-a p:last-child {
    margin-bottom: 0
}

.bcc-faq-row::details-content {
    block-size: 0;
    overflow: hidden;
    transition: block-size .18s cubic-bezier(.4, 0, .6, 1), content-visibility .18s allow-discrete
}

.bcc-faq-row[open]::details-content {
    block-size: auto;
    transition: block-size .22s cubic-bezier(.22, .61, .36, 1), content-visibility .22s allow-discrete
}

@media(min-width:768px) {
    .bcc-faq {
        padding-top: 65px;
        padding-bottom: 96px
    }
    .bcc-faq-head {
        margin-top: 14px
    }
    .bcc-faq-list {
        margin-top: 43px
    }
    .bcc-faq-q {
        padding: 32px 0;
        font-size: var(--text-heading-sm)
    }
}

.bcc-x .bcc-faq-head .bcc-faq-stroke {
    clip-path: inset(0 100% 0 0);
    transition: clip-path .8s var(--bcc-ease-settle) .24s
}

.bcc-x .bcc-faq-head.bcc-in .bcc-faq-stroke {
    clip-path: inset(0 0 0 0)
}

.bcc-x .bcc-faq-list .bcc-faq-row {
    border-bottom-color: transparent;
    background-image: linear-gradient(var(--color-grey-20), var(--color-grey-20));
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 0 1px;
    transition: opacity .7s var(--bcc-ease-settle) var(--rd), transform .7s var(--bcc-ease-settle) var(--rd), background-size .6s var(--bcc-ease-settle) calc(var(--rd) + .15s)
}

.bcc-x .bcc-faq-list .bcc-faq-row.bcc-in {
    background-size: 100% 1px
}

@media(prefers-reduced-motion:reduce) {
    .bcc-faq-chev,
    .bcc-faq-row::details-content,
    .bcc-faq-row[open]::details-content {
        transition: none
    }
}

.bcc {
    --bcc-nav-h: 53px;
    --bcc-paper: var(--color-grey-5);
    --bcc-dot: color-mix(in srgb, var(--color-grey-20) 28%, var(--color-grey-5));
    --bcc-pitch: 11px;
    --bcc-ease-settle: cubic-bezier(.22, 1, .36, 1);
    --bcc-gutter: clamp(20px, 4.17vw, 60px);
    --bcc-column: 1320px;
    position: relative;
    isolation: isolate;
    background: var(--bcc-paper);
    color: var(--color-text-default)
}

@media(min-width:768px) {
    .bcc {
        --bcc-nav-h: 69px
    }
}

.bcc-dots {
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 110%;
    background-color: var(--bcc-paper);
    background-image: radial-gradient(circle at center, var(--bcc-dot) 0 1.5px, transparent 1.6px);
    background-size: var(--bcc-pitch) var(--bcc-pitch)
}

.bcc-frame {
    position: relative
}

.bcc-stage {
    position: relative;
    min-height: 100vh;
    min-height: 100svh;
    min-height: 100dvh
}

.bcc-stage-hero {
    height: 100vh;
    height: 100svh;
    height: 100dvh
}

.bcc-stage-stress {
    display: grid;
    place-items: center;
    padding: 96px 24px
}

.bcc-stmt-inner {
    max-width: 100%
}

.bcc-stmt-head {
    font-size: min(40px, 10.2vw);
    font-weight: 600;
    line-height: 1.2;
    color: var(--color-grey-100)
}

@media(min-width:768px) {
    .bcc-stmt-head {
        font-size: clamp(48px, 4.72vw, 68px)
    }
}

.bcc-x .bcc-runway {
    height: var(--bcc-runway-h, 420svh)
}

.bcc-x .bcc-frame {
    position: sticky;
    top: 0;
    height: 100svh;
    height: 100dvh;
    overflow: hidden;
    container-type: size
}

.bcc-x .bcc-stage {
    position: absolute;
    inset: 0;
    min-height: 0
}

.bcc-x :is(.bcc-stage-hero, .bcc-stage-stress) {
    opacity: calc(1 - clamp(0, calc((var(--bcc-p, 0) - var(--fade-a)) / var(--fade-d)), 1))
}

.bcc-x .bcc-stage-hero {
    --fade-a: var(--bcc-hero-a);
    --fade-d: var(--bcc-hero-d);
    z-index: 2
}

.bcc-x .bcc-stage-stress {
    --fade-a: var(--bcc-stress-out-a);
    --fade-d: var(--bcc-stress-out-d);
    z-index: 1
}

@media(max-width:767.9px),
(orientation:portrait) {
    .bcc-x .bcc-stage-stress {
        --fade-a: var(--bcc-stress-out-a-sm)
    }
}

.bcc-x .bcc-stage-grid {
    z-index: 1;
    pointer-events: none
}

.bcc-x[data-hero-out] .bcc-stage-hero {
    visibility: hidden;
    pointer-events: none
}

.bcc-topnav {
    --bpc-nav-surface: var(--bcc-paper);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 50
}

.bcc-x .bcc-topnav {
    transition: transform .35s var(--bcc-ease-settle)
}

.bcc[data-nav-hidden] .bcc-topnav:not(:focus-within) {
    transform: translateY(-102%)
}

.bcc[data-nav-hidden]:not(:has(.bcc-topnav:focus-within)) {
    --bcc-nav-h: 0px
}

.bcc-x [data-bcc-clear] {
    transition: border-top-width .35s var(--bcc-ease-settle)
}

:root:has(.bcc) {
    overflow-anchor: none
}

.bcc-x :is(.bcc-word, .bcc-stroke, .bcc-chip) {
    --w: clamp(0, calc((var(--bcc-p, 0) - var(--ws, 0)) / var(--wd, .05)), 1)
}

.bcc-x .bcc-word {
    opacity: var(--w);
    filter: blur(calc((1 - var(--w)) * 6px));
    transform: translateY(calc((1 - var(--w)) * 10px))
}

.bcc-x .bcc-stroke {
    --wd: var(--bcc-stroke-wd, .08);
    clip-path: inset(0 calc((1 - var(--w)) * 100%) 0 0)
}

.bcc-x .bcc-chip {
    --wa: clamp(0, calc((var(--bcc-p, 0) - var(--wsa, 0)) / var(--wd, .05)), 1);
    opacity: var(--w);
    transform: translateY(calc((1 - var(--w)) * 24px))
}

.bcc-x .bcc-chip-disc {
    transform: scale(calc(.5 + .5 * var(--w)))
}

.bcc-x .bcc-chip-zig,
.bcc-x .bcc-chip-tip {
    stroke-dasharray: 1
}

.bcc-x .bcc-chip-zig {
    stroke-dashoffset: clamp(0, calc(1 - 2 * var(--wa)), 1)
}

.bcc-x .bcc-chip-tip {
    stroke-dashoffset: clamp(0, calc(2 - 2 * var(--wa)), 1)
}

.bcc-after {
    position: relative
}

.bcc-x [data-bcc-reveal] {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .7s var(--bcc-ease-settle), transform .7s var(--bcc-ease-settle);
    transition-delay: var(--rd, 0s)
}

.bcc-x [data-bcc-reveal].bcc-in {
    opacity: 1;
    transform: none
}

.bcc-x [data-bcc-scrub] .bcc-sw {
    --w: clamp(0, calc((var(--sp, 0) - var(--ws, 0)) / var(--wd, .16)), 1);
    --wo: calc(var(--w) * (2 - var(--w)))
}

html.bcc-snap {
    scroll-snap-type: y mandatory
}

html.bcc-snap-soft {
    scroll-snap-type: y proximity
}

.bcc-footer {
    position: relative;
    z-index: 1;
    margin-top: -1px
}

.bcc-modal-host {
    display: none
}

.bcc-grain {
    position: fixed;
    top: -3%;
    left: -3%;
    z-index: 70;
    width: 106%;
    height: 106%;
    pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    opacity: .42;
    mix-blend-mode: overlay;
    animation: bcc-grain .9s steps(1, end) infinite
}

@keyframes bcc-grain {
    0% {
        transform: translateZ(0)
    }
    20% {
        transform: translate3d(-1.5%, 1%, 0)
    }
    40% {
        transform: translate3d(1%, -1.5%, 0)
    }
    60% {
        transform: translate3d(-1%, -.5%, 0)
    }
    80% {
        transform: translate3d(1.5%, 1%, 0)
    }
}

@media(prefers-reduced-motion:reduce) {
    .bcc-grain {
        animation: none
    }
}

.bcc-hero-media {
    position: absolute;
    inset: 0;
    overflow: hidden
}

.bcc-hero-media :is(img,
video) {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%
}

.bcc-hero-video {
    opacity: 0
}

.bcc-hero-video.bcc-hero-video-live {
    opacity: 1
}

@media(prefers-reduced-motion:no-preference) {
    .bcc-hero-video {
        transition: opacity .26s var(--ease-smooth)
    }
}

.bcc-hero-media video {
    pointer-events: none
}

.bcc-hero-media video::-webkit-media-controls-start-playback-button {
    display: none;
    -webkit-appearance: none
}

.bcc-hero-soft {
    opacity: 0
}

.bcc-hero-seasons-video {
    opacity: 0;
    transform: scale(1.04);
    transition: opacity 1.3s ease-in-out, transform 1.6s var(--bcc-ease-settle)
}

.bcc-hero-seasons .bcc-hero-seasons-video.bcc-hero-seasons-live {
    opacity: 1;
    transform: scale(1)
}

@media(prefers-reduced-motion:reduce) {
    .bcc-hero-tape {
        pointer-events: none
    }
}

@media(min-width:768px) {
    .bcc-hero-content {
        transition: transform .85s var(--bcc-ease-settle)
    }
    .bcc-hero-title-mask {
        transform-origin: left top;
        transition: transform .85s var(--bcc-ease-settle) 70ms
    }
    .bcc-hero-tape {
        transform-origin: left bottom;
        transition: transform .85s var(--bcc-ease-settle) 40ms
    }
    .bcc-hero-cta {
        transition: background-color .15s var(--ease-smooth), transform .85s var(--bcc-ease-settle) .14s
    }
    .bcc-hero-seasons .bcc-hero-content {
        transform: translateY(calc(50svh - 203px))
    }
    .bcc-hero-seasons .bcc-hero-title-mask {
        transform: scale(.58)
    }
    .bcc-hero-seasons .bcc-hero-tape {
        transform: translateY(6px) scale(.85) rotate(-4deg)
    }
    .bcc-hero-seasons .bcc-hero-sub {
        --bcc-sub-pose: -52px
    }
    .bcc-hero-seasons .bcc-hero-cta {
        transform: translateY(-38px)
    }
}

.bcc-hero-scrim {
    position: absolute;
    inset: 0 0 auto;
    height: 78%;
    background: linear-gradient(to bottom, color-mix(in srgb, var(--color-black) 72%, transparent), color-mix(in srgb, var(--color-black) 42%, transparent) 45%, transparent);
    opacity: .83;
    pointer-events: none
}

.bcc-hero-content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
    padding: 17.6svh 20px 0
}

.bcc-hero-tape {
    position: relative;
    display: inline-flex;
    margin-bottom: 12px;
    cursor: pointer;
    user-select: none;
    -webkit-tap-highlight-color: transparent
}

.bcc-hero-title-mask {
    overflow: hidden;
    padding: .08em 8px;
    margin: -.08em -8px
}

.bcc-hero-title {
    font-size: var(--text-headline-xl);
    font-weight: 600;
    line-height: var(--text-headline-xl--line-height);
    letter-spacing: var(--text-headline-xl--letter-spacing);
    color: var(--color-white)
}

.bcc-hero-sub {
    height: 0;
    overflow: visible
}

.bcc-hero-sub span {
    display: inline-block;
    padding-top: 4px;
    font-family: var(--bpc-font-script);
    font-size: var(--text-headline-sm);
    line-height: 1;
    color: var(--color-white);
    text-shadow: var(--bpc-text-shadow-media);
    opacity: 0;
    visibility: hidden;
    transform: rotate(-2deg) translateY(calc(var(--bcc-sub-pose, 0px) + 12px));
    transition: opacity .5s ease .35s, transform .5s var(--bcc-ease-settle) .35s, visibility 0s linear .85s
}

.bcc-hero-seasons .bcc-hero-sub span {
    opacity: 1;
    visibility: visible;
    transform: rotate(-2deg) translateY(var(--bcc-sub-pose, 0px));
    transition: opacity .5s ease .35s, transform .5s var(--bcc-ease-settle) .35s, visibility 0s
}

.bcc-hero-cta {
    width: 226px;
    margin-top: 32px
}

.bcc-stage-hero .bcc-hero-cta:focus-visible {
    outline: 2px solid var(--color-white);
    outline-offset: 3px
}

.bcc-hero-cta-arrow {
    flex: none;
    width: 15px;
    height: 15px;
    transform: rotate(90deg)
}

@media(prefers-reduced-motion:no-preference) {
    .bcc-hero-cta-arrow {
        transition: transform .2s var(--ease-smooth)
    }
    .bcc-hero-cta:hover .bcc-hero-cta-arrow {
        transform: rotate(90deg) translate(3px)
    }
}

.bcc-hero-videocard {
    position: absolute;
    right: clamp(20px, 2.78vw, 40px);
    bottom: clamp(20px, 2.22vw, 32px);
    z-index: 1;
    width: clamp(164px, 21.04vw, 303px);
    aspect-ratio: 303 / 188;
    border-radius: clamp(13px, 1.55vw + 1px, 23px);
    overflow: hidden;
    box-shadow: var(--bpc-shadow-media)
}

.bcc-hero-videocard img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover
}

@media(prefers-reduced-motion:no-preference) {
    .bcc-hero-videocard img,
    .bcc-hero-play {
        transition: transform .25s var(--ease-smooth)
    }
    .bcc-hero-videocard:hover img,
    .bcc-hero-videocard:focus-visible img {
        transform: scale(1.045)
    }
    .bcc-hero-videocard:hover .bcc-hero-play,
    .bcc-hero-videocard:focus-visible .bcc-hero-play {
        transform: translate(-50%, -50%) scale(1.14)
    }
}

.bcc-hero-videocard:focus-visible {
    outline: 2px solid var(--color-white);
    outline-offset: 3px
}

@media(max-height:640px) {
    .bcc-hero-videocard {
        display: none
    }
}

.bcc-hero-play {
    position: absolute;
    top: 50%;
    left: 50%;
    width: clamp(28px, 2.78vw, 40px);
    height: clamp(28px, 2.78vw, 40px);
    transform: translate(-50%, -50%);
    fill: currentColor;
    color: var(--color-white);
    filter: drop-shadow(var(--bpc-drop-shadow-media))
}

@media(min-width:768px) {
    .bcc-hero-content {
        align-items: flex-start;
        justify-content: center;
        padding: 0 0 0 clamp(24px, 4.58vw, 66px)
    }
    .bcc-hero-scrim {
        inset: 0 auto 0 0;
        width: min(897px, 92%);
        height: auto;
        background: linear-gradient(to right, color-mix(in srgb, var(--color-black) 72%, transparent), color-mix(in srgb, var(--color-black) 60%, transparent) 52%, transparent)
    }
    .bcc-hero-media:after {
        content: "";
        position: absolute;
        inset: 0 0 auto;
        height: 140px;
        background: linear-gradient(to bottom, color-mix(in srgb, var(--color-black) 45%, transparent), transparent)
    }
    .bcc-hero-cta {
        margin-top: 40px
    }
    .bcc-hero-cta-arrow {
        width: 22px;
        height: 22px
    }
}

.bcc-x .bcc-hero-media {
    transform: scale(calc(1 + .05*clamp(0, calc(var(--bcc-p, 0) / var(--bcc-scale-d)), 1)));
    will-change: transform
}

.bcc-x .bcc-hero-soft {
    opacity: clamp(0, calc((var(--bcc-p, 0) - var(--bcc-soft-a)) / var(--bcc-soft-d)), 1);
    will-change: opacity
}

.bcc-x[data-hero-out] .bcc-hero-media,
.bcc-x[data-hero-out] .bcc-hero-soft {
    will-change: auto
}

.bcc-x .bcc-hero-content,
.bcc-x .bcc-hero-videocard {
    opacity: calc(1 - clamp(0, calc((var(--bcc-p, 0) - var(--bcc-chrome-a)) / var(--bcc-chrome-d)), 1))
}

@media(prefers-reduced-motion:no-preference) {
    .bcc-hero-poster,
    .bcc-hero-video,
    .bcc-hero-soft {
        animation: bcc-hero-scene-in 4.5s var(--bcc-ease-settle) backwards
    }
    .bcc-hero-tape {
        animation: bcc-hero-tape-in .45s var(--ease-bounce) .4s backwards, bcc-hero-fade-in .2s ease-out .4s backwards
    }
    .bcc-hero-title {
        animation: bcc-hero-title-in .65s var(--bcc-ease-settle) .5s backwards
    }
    .bcc-hero-cta {
        animation: bcc-hero-cta-in .45s var(--ease-smooth) .75s backwards
    }
    .bcc-hero-videocard {
        animation: bcc-hero-card-in .5s var(--ease-smooth) .9s backwards
    }
    @keyframes bcc-hero-scene-in {
        0% {
            transform: scale(1.04)
        }
    }
    @keyframes bcc-hero-fade-in {
        0% {
            opacity: 0
        }
    }
    @keyframes bcc-hero-tape-in {
        0% {
            transform: translateY(-14px) rotate(-6deg) scale(1.06)
        }
    }
    @keyframes bcc-hero-title-in {
        0% {
            transform: translateY(105%)
        }
    }
    @keyframes bcc-hero-cta-in {
        0% {
            opacity: 0;
            transform: translateY(10px)
        }
    }
    @keyframes bcc-hero-card-in {
        0% {
            opacity: 0;
            transform: translateY(16px) scale(.96)
        }
    }
}

.bcc-how {
    position: relative
}

.bcc-how-screen {
    display: flex;
    align-items: center;
    min-height: 100svh;
    padding: 96px clamp(22px, 5.14vw, 80px)
}

.bcc-how-inner {
    width: 100%;
    max-width: 1280px;
    margin-inline: auto
}

.bcc-how-head {
    margin: 0 0 40px;
    font-size: var(--text-heading-md);
    font-weight: 600;
    line-height: var(--text-heading-md--line-height);
    letter-spacing: var(--text-heading-md--letter-spacing);
    text-wrap: balance;
    color: var(--color-green-90)
}

@media(min-width:991px) {
    .bcc-how-head {
        font-size: var(--text-heading-lg);
        line-height: var(--text-heading-lg--line-height);
        letter-spacing: var(--text-heading-lg--letter-spacing)
    }
}

.bcc-how-list {
    display: grid;
    gap: 60px;
    margin: 0;
    padding: 0;
    list-style: none
}

.bcc-how-step {
    position: relative;
    padding-left: var(--bcc-how-indent, 41px)
}

.bcc-how-rule {
    position: absolute;
    top: 0;
    left: 0;
    width: 9px;
    height: 100%
}

.bcc-how-chip {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-full);
    background: var(--color-white);
    font-size: var(--text-body-lg);
    font-weight: 600;
    line-height: var(--text-body-lg--line-height);
    letter-spacing: var(--text-body-lg--letter-spacing);
    color: var(--color-green-90)
}

.bcc-how-title {
    margin: 10px 0 0;
    font-size: var(--text-headline-sm);
    font-weight: 600;
    line-height: var(--text-headline-sm--line-height);
    letter-spacing: var(--text-headline-sm--letter-spacing);
    color: var(--color-green-90)
}

.bcc-how-body {
    margin: 10px 0 0;
    font-size: var(--text-body-lg);
    font-weight: 500;
    line-height: var(--text-body-lg--line-height);
    letter-spacing: var(--text-body-lg--letter-spacing);
    color: var(--color-grey-80)
}

.bcc-how-cta {
    display: flex;
    margin-top: 42px
}

@media(max-width:767.9px) {
    .bcc-how-btn {
        flex: 1
    }
}

.bcc-how-m {
    display: none
}

@media(max-width:1023.9px) {
    .bcc-how-d {
        display: none
    }
    .bcc-how-m {
        display: inline
    }
    .bcc-x .bcc-how :is(.bcc-how-rule,
    .bcc-how-chip,
    .bcc-how-title,
    .bcc-how-body,
    .bcc-how-cta) {
        --ws: calc(var(--df, 0) * (1 - var(--sv, .5)) + (1 - var(--wp, .88)) * var(--sv, .5));
        --wd: calc(var(--wf, .3) * var(--sv, .5))
    }
    .bcc-how-step-1 {
        --df: .217
    }
    .bcc-how-step-2 {
        --df: .438
    }
    .bcc-how-step-3 {
        --df: .635
    }
    .bcc-how-cta {
        --df: .868
    }
    .bcc-how-rule {
        --wp: .94;
        --wf: .24
    }
    .bcc-how-chip {
        --wp: .86;
        --wf: .12
    }
    .bcc-how-title {
        --wp: .84;
        --wf: .14
    }
    .bcc-how-body {
        --wp: .76;
        --wf: .16
    }
    .bcc-how-cta {
        --wp: .97;
        --wf: .12
    }
}

@media(min-width:768px)and (max-width:1023.9px) {
    .bcc-how-inner {
        max-width: 640px
    }
    .bcc-how-head {
        margin-bottom: 48px
    }
}

@media(min-width:1024px) {
    .bcc-how-screen {
        padding: 120px clamp(22px, 5.14vw, 80px)
    }
    .bcc-how-head {
        margin-bottom: clamp(64px, 7.5vw, 108px)
    }
    .bcc-how-list {
        --bcc-how-indent: 45px;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: clamp(40px, 6.18vw, 89px);
        align-items: stretch
    }
    .bcc-how-title {
        font-size: var(--text-headline-sm)
    }
    .bcc-how-body {
        font-size: var(--text-body-lg)
    }
    .bcc-how-rule {
        width: 11px
    }
    .bcc-how-chip {
        width: 30px;
        height: 30px
    }
    .bcc-how-cta {
        justify-content: center;
        margin-top: 28px
    }
    .bcc-x .bcc-how {
        height: 180svh
    }
    .bcc-x .bcc-how-screen {
        position: sticky;
        top: 0;
        height: 100svh;
        min-height: 0;
        border-top: var(--bcc-nav-h) solid transparent
    }
    .bcc-how-rule {
        --wd: .14
    }
    .bcc-how-chip {
        --wd: .1
    }
    .bcc-how-title,
    .bcc-how-body,
    .bcc-how-cta {
        --wd: .12
    }
    .bcc-how-step-1 .bcc-how-rule {
        --ws: .06
    }
    .bcc-how-step-1 .bcc-how-title {
        --ws: .13
    }
    .bcc-how-step-1 .bcc-how-chip {
        --ws: .14
    }
    .bcc-how-step-1 .bcc-how-body {
        --ws: .18
    }
    .bcc-how-step-2 .bcc-how-rule {
        --ws: .22
    }
    .bcc-how-step-2 .bcc-how-title {
        --ws: .29
    }
    .bcc-how-step-2 .bcc-how-chip {
        --ws: .3
    }
    .bcc-how-step-2 .bcc-how-body {
        --ws: .34
    }
    .bcc-how-step-3 .bcc-how-rule {
        --ws: .38
    }
    .bcc-how-step-3 .bcc-how-title {
        --ws: .45
    }
    .bcc-how-step-3 .bcc-how-chip {
        --ws: .46
    }
    .bcc-how-step-3 .bcc-how-body {
        --ws: .5
    }
    .bcc-how-cta {
        --ws: .66
    }
}

@media(min-width:1024px)and (max-height:720px) {
    .bcc-how-screen {
        padding-block: 64px 44px
    }
    .bcc-how-head {
        margin-bottom: 36px
    }
    .bcc-how-cta {
        margin-top: 36px
    }
}

.bcc-x .bcc-how-rule {
    clip-path: inset(0 0 calc((1 - var(--wo)) * 100%) 0)
}

.bcc-x .bcc-how-chip {
    opacity: var(--w);
    transform: scale(calc(.62 + .38 * var(--wo)))
}

.bcc-x .bcc-how-title {
    opacity: var(--w);
    transform: translateY(calc((1 - var(--wo)) * 12px));
    filter: blur(calc((1 - var(--w)) * 4px))
}

.bcc-x .bcc-how-body,
.bcc-x .bcc-how-cta {
    opacity: var(--w);
    transform: translateY(calc((1 - var(--wo)) * 16px))
}

.bcc-x .bcc-how .bcc-how-cta:focus-within {
    --w: 1;
    --wo: 1
}

.bcc-meet {
    --wd: .14;
    --spx: var(--sp, 0);
    position: relative
}

.bcc-meet-screen {
    display: flex;
    align-items: center;
    min-height: 100svh;
    padding: 76px 24px 36px
}

.bcc-meet-inner {
    width: 100%;
    max-width: 1256px;
    margin-inline: auto
}

.bcc-meet .bcc-meet-head {
    font-size: var(--text-headline-md);
    line-height: 1.37;
    letter-spacing: var(--text-headline-md--letter-spacing)
}

.bcc-meet-line {
    display: inline
}

.bcc-meet-green {
    color: var(--color-green-90)
}

.bcc-meet-w {
    display: inline-block
}

.bcc-meet-pic,
.bcc-meet-ico {
    --iy: .1em;
    --icap: 0em;
    display: inline-block;
    width: auto;
    margin-block: calc(var(--icap) - 2 * var(--iy)) var(--icap);
    vertical-align: middle
}

.bcc-meet-pic {
    --icap: -.055em;
    height: 1.48em;
    margin-inline: .28em .13em
}

.bcc-meet-mark {
    white-space: nowrap
}

.bcc-meet-ico {
    height: var(--ih, 1em);
    margin-inline: .18em .02em
}

.bcc-meet-ico-house {
    --ih: 1.35em
}

.bcc-meet-ico-bolt {
    --ih: 1.03em
}

.bcc-meet-ico-dollar {
    --ih: 1.01em
}

.bcc-meet-ico-tower {
    --ih: .87em
}

.bcc-meet-sub {
    margin-top: 34px
}

.bcc-meet-sub-bold {
    margin: 0;
    font-size: var(--text-heading-sm);
    font-weight: 600;
    color: var(--color-grey-100)
}

.bcc-meet-sub-muted {
    margin: 10px 0 0;
    font-size: var(--text-body-lg);
    font-weight: 500;
    color: var(--color-grey-60)
}

.bcc-meet-cta {
    display: flex;
    flex-direction: column;
    gap: 18px;
    margin-top: 42px
}

.bcc-meet-more {
    font-size: var(--text-body-sm);
    font-weight: 500;
    letter-spacing: var(--text-body-sm--letter-spacing);
    color: var(--color-grey-80);
    text-decoration: none
}

.bcc-meet-more:hover {
    text-decoration: underline
}

.bcc-meet-more:focus-visible {
    outline: 2px solid var(--color-green-90);
    outline-offset: 3px
}

@media(max-width:767.9px) {
    .bcc-meet-ico-house {
        --ih: 1.11em
    }
    .bcc-meet-ico-bolt,
    .bcc-meet-ico-dollar {
        --ih: 1.1em
    }
    .bcc-meet-ico-tower {
        --ih: .81em
    }
    .bcc-meet-pic {
        --icap: 0em;
        height: 1.15em
    }
    .bcc-x .bcc-meet {
        --spx: clamp(0, calc((var(--sp, 0) - .04) / .44), 1)
    }
}

@media(min-width:768px) {
    .bcc-meet-screen {
        padding: 100px 24px 64px
    }
    .bcc-x .bcc-meet {
        height: 320svh
    }
    .bcc-x .bcc-meet-screen {
        position: sticky;
        top: 0;
        height: 100svh;
        min-height: 0;
        border-top: var(--bcc-nav-h) solid transparent
    }
    .bcc-meet .bcc-meet-head {
        font-size: var(--text-headline-md)
    }
    .bcc-meet-line {
        display: inline-block
    }
    .bcc-meet-sub {
        margin-top: 56px
    }
    .bcc-meet-sub-bold {
        font-size: var(--text-headline-sm)
    }
    .bcc-meet-sub-muted {
        font-size: var(--text-heading-sm)
    }
    .bcc-meet-cta {
        flex-direction: row;
        align-items: center;
        gap: 32px;
        margin-top: 56px
    }
    .bcc-meet-more {
        font-size: var(--text-body-lg);
        letter-spacing: var(--text-body-lg--letter-spacing)
    }
}

.bcc-x .bcc-meet .bcc-meet-head>.bcc-meet-w,
.bcc-x .bcc-meet .bcc-meet-head>.bcc-meet-mark>:is(.bcc-meet-w,
.bcc-meet-ico),
.bcc-x .bcc-meet .bcc-meet-sub {
    --w: clamp(0, calc((var(--spx) - var(--ws, 0)) / var(--wd)), 1);
    --wo: calc(var(--w) * (2 - var(--w)))
}

.bcc-x .bcc-meet-head>.bcc-meet-w,
.bcc-x .bcc-meet-head>.bcc-meet-mark>.bcc-meet-w {
    opacity: var(--w);
    transform: translateY(calc((1 - var(--wo)) * 14px));
    filter: blur(calc((1 - var(--w)) * 5px))
}

.bcc-x .bcc-meet-head>.bcc-meet-mark>.bcc-meet-ico {
    opacity: var(--w);
    transform: scale(calc(.6 + .4 * var(--wo)))
}

.bcc-x .bcc-meet .bcc-meet-sub {
    opacity: var(--w);
    transform: translateY(calc((1 - var(--wo)) * 18px))
}

.bcc-x .bcc-meet-line .bcc-meet-w {
    opacity: 0;
    transform: translateY(14px);
    filter: blur(5px);
    transition: opacity .5s var(--bcc-ease-settle), transform .5s var(--bcc-ease-settle), filter .5s var(--bcc-ease-settle);
    transition-delay: var(--cd, 0s)
}

.bcc-x .bcc-meet-line .bcc-meet-pic {
    opacity: 0;
    transform: scale(.6);
    transition: opacity .45s var(--bcc-ease-settle) .42s, transform .45s var(--bcc-ease-settle) .42s
}

.bcc-x .bcc-meet-line.bcc-in .bcc-meet-w {
    opacity: 1;
    transform: none;
    filter: none
}

.bcc-x .bcc-meet-line.bcc-in .bcc-meet-pic {
    opacity: 1;
    transform: none
}

.bcc-x .bcc-meet-cta {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .5s var(--bcc-ease-settle), transform .5s var(--bcc-ease-settle)
}

.bcc-x .bcc-meet:not([data-bcc-cued]) .bcc-meet-cta:not(:focus-within) {
    visibility: hidden;
    pointer-events: none
}

.bcc-x .bcc-meet[data-bcc-cued] .bcc-meet-cta,
.bcc-x .bcc-meet .bcc-meet-cta:focus-within {
    opacity: 1;
    transform: none
}

@property --bcc-rail-ink {
    syntax: "<number>";
    initial-value: 0;
    inherits: true;
}

html.bcc-hide-scrollbar {
    scrollbar-width: none
}

html.bcc-hide-scrollbar::-webkit-scrollbar {
    width: 0;
    height: 0
}

.bcc-rail {
    --rail-reach: 4;
    --rail-w0: 6px;
    --rail-wsw: 10px;
    --rail-h0: 3px;
    --rail-hsw: 1px;
    --ink: var(--bcc-rail-ink, 0);
    --rail-tint: color-mix(in srgb, var(--color-grey-100), var(--color-white) calc(var(--ink) * 100%));
    position: fixed;
    top: 50%;
    right: clamp(10px, 1.1vw, 16px);
    z-index: 45;
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-items: flex-end;
    pointer-events: none;
    transform: translateY(-50%);
    contain: layout paint;
    opacity: calc(clamp(0, calc((var(--bcc-ai, 0) - .15) / .4), 1)*(1 - clamp(0, calc((var(--bcc-ai, 0) - var(--rail-exit)) / .3), 1)))
}

.bcc-rail-slot {
    --d: max(calc(var(--i) - var(--bcc-ai, 0)), calc(var(--bcc-ai, 0) - var(--i)));
    --t: clamp(0, calc(1 - var(--d) / var(--rail-reach)), 1);
    --m: calc(var(--t) * var(--t));
    --s: clamp(0, calc(1 - var(--d) / .5), 1);
    --se: calc(var(--s) * (2 - var(--s)));
    --past: clamp(0, calc(var(--bcc-ai, 0) - var(--i) + .5), 1);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    height: 6px
}

.bcc-rail-pill {
    --a: calc(.12 + .06 * var(--past) + .26 * var(--se));
    width: calc(var(--rail-w0) + var(--rail-wsw) * var(--m));
    height: calc(var(--rail-h0) + var(--rail-hsw) * var(--m));
    border-radius: var(--radius-full);
    background: color-mix(in srgb, var(--rail-tint) calc(var(--a) * 100%), transparent);
    box-shadow: inset 0 .5px rgb(255 255 255 / calc(.22 + .2 * var(--ink) + .18 * var(--se))), 0 .5px 1.5px rgb(0 0 0 / calc(.08 + .1 * var(--ink)))
}

.bcc-x .bcc-rail {
    transition: --bcc-rail-ink .32s var(--bcc-ease-settle)
}

@media(max-height:720px) {
    .bcc-rail {
        gap: 4px
    }
    .bcc-rail-slot {
        height: 5px
    }
}

@media(max-width:767px) {
    .bcc-rail {
        --rail-w0: 4px;
        --rail-wsw: 6px;
        --rail-h0: 2px;
        --rail-hsw: 0px;
        right: 5px;
        gap: 5px
    }
    .bcc-rail-slot {
        height: 4px
    }
    .bcc-rail-pill {
        --a: calc(.1 + .05 * var(--past) + .2 * var(--se));
        box-shadow: none
    }
}

@media(prefers-reduced-motion:reduce) {
    .bcc-rail {
        --rail-wsw: 0px;
        --rail-hsw: 0px;
        --rail-w0: 12px;
        --rail-h0: 3px
    }
    .bcc-rail-pill {
        box-shadow: none
    }
}

.bcc-specs {
    position: relative;
    padding: 64px var(--bcc-gutter) 96px
}

.bcc-specs-inner {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
    max-width: var(--bcc-column);
    margin-inline: auto
}

.bcc-specs-head {
    position: relative;
    align-self: flex-start;
    margin: 0 0 24px;
    font-size: var(--text-heading-md);
    font-weight: 600;
    line-height: var(--text-heading-md--line-height);
    letter-spacing: var(--text-heading-md--letter-spacing);
    text-wrap: balance;
    color: var(--color-green-90)
}

@media(min-width:991px) {
    .bcc-specs-head {
        font-size: var(--text-heading-lg);
        line-height: var(--text-heading-lg--line-height);
        letter-spacing: var(--text-heading-lg--letter-spacing)
    }
}

.bcc-specs-stroke {
    position: absolute;
    left: 0;
    bottom: -.06em;
    z-index: -1;
    width: 100%;
    height: .17em
}

.bcc-specs-group {
    padding-bottom: 24px;
    border-bottom: 1px solid var(--color-grey-20)
}

.bcc-specs-group:last-child {
    padding-bottom: 0;
    border-bottom: 0
}

.bcc-specs-gtitle {
    margin: 0 0 33px;
    font-size: var(--text-body-lg);
    font-weight: 600;
    line-height: var(--text-body-lg--line-height);
    letter-spacing: var(--text-body-lg--letter-spacing);
    color: var(--color-green-90)
}

.bcc-specs-rows {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 24px;
    row-gap: 40px;
    margin: 0
}

.bcc-specs-cell-wide {
    grid-column: 1 / -1
}

.bcc-specs-cell dt {
    margin: 0;
    font-weight: 600;
    color: var(--color-grey-80)
}

.bcc-specs-cell dd {
    margin: 12px 0 0;
    font-weight: 600;
    color: var(--color-grey-100)
}

.bcc-core-rain-trigger {
    position: relative;
    appearance: none;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: var(--radius-full);
    background: transparent;
    color: inherit;
    font: inherit;
    line-height: inherit;
    text-align: inherit;
    cursor: inherit;
    touch-action: manipulation
}

.bcc-core-rain-trigger:before {
    content: "";
    position: absolute;
    inset: -12px -6px;
    border-radius: inherit
}

.bcc-core-rain-trigger:focus-visible {
    outline: 2px solid var(--color-green-90);
    outline-offset: 3px
}

.bcc-core-rain-overlay {
    position: fixed;
    inset: 0;
    z-index: 60;
    overflow: clip;
    pointer-events: none;
    contain: strict
}

.bcc-core-rain-drop {
    position: absolute;
    top: -18vh;
    left: var(--core-x);
    width: var(--core-size);
    max-width: none;
    height: auto;
    opacity: 0;
    user-select: none;
    will-change: transform, opacity;
    animation: bcc-core-rain-fall var(--core-duration) linear var(--core-delay) both
}

.bcc-core-rain-drop-static {
    top: var(--core-y);
    opacity: 1;
    transform: translate3d(-50%, -50%, 0) rotate(var(--core-rotation-static));
    will-change: auto;
    animation: none
}

.bcc-specs[data-bcc-core-rain-mode=falling] .bcc-specs-inner {
    animation: bcc-core-rain-shake .43s linear 70ms both
}

.bcc-core-rain-status {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0
}

@keyframes bcc-core-rain-shake {
    0%,
    to {
        transform: none
    }
    14% {
        transform: translate3d(-5px, 2px, 0) rotate(-.08deg)
    }
    29% {
        transform: translate3d(4px, -2px, 0) rotate(.06deg)
    }
    44% {
        transform: translate3d(-3px, 1px, 0) rotate(-.04deg)
    }
    59% {
        transform: translate3d(2px, -1px, 0) rotate(.03deg)
    }
    74% {
        transform: translate3d(-1px, 0, 0)
    }
    88% {
        transform: translate3d(1px, 0, 0)
    }
}

@keyframes bcc-core-rain-fall {
    0% {
        opacity: 0;
        transform: translate3d(-50%, -30%, 0) rotate(var(--core-rotation-start))
    }
    6%,
    94% {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(calc(-50% + var(--core-drift)), calc(128vh + var(--core-size)), 0) rotate(var(--core-rotation-end))
    }
}

@media(min-width:768px) {
    .bcc-specs {
        padding-top: 62px;
        padding-bottom: 120px
    }
    .bcc-specs-group {
        max-width: 1099px
    }
    .bcc-specs-head {
        margin-bottom: 51px
    }
    .bcc-specs-rows {
        row-gap: 32px
    }
    .bcc-specs-gtitle {
        margin-bottom: 8px
    }
}

@media(min-width:1024px) {
    .bcc-specs-rows {
        grid-template-columns: repeat(4, minmax(0, 200px));
        column-gap: 63px
    }
    .bcc-specs-cell-wide {
        grid-column: auto
    }
}

.bcc-x .bcc-specs .bcc-specs-cell {
    transform: translateY(10px)
}

.bcc-x .bcc-specs .bcc-specs-cell.bcc-in {
    transform: none
}

.bcc-x .bcc-specs .bcc-specs-cell dd {
    opacity: 0;
    transition: opacity .7s var(--bcc-ease-settle) calc(var(--rd) + 12ms)
}

.bcc-x .bcc-specs .bcc-specs-cell.bcc-in dd {
    opacity: 1
}

.bcc-x .bcc-specs .bcc-specs-group {
    opacity: 1;
    transform: none;
    border-bottom-color: transparent;
    background-image: linear-gradient(var(--color-grey-20), var(--color-grey-20));
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 0 1px;
    transition: background-size .7s var(--bcc-ease-settle) calc(var(--rd) + .2s)
}

.bcc-x .bcc-specs .bcc-specs-group:last-child {
    background-image: none
}

.bcc-x .bcc-specs .bcc-specs-group.bcc-in {
    background-size: 100% 1px
}

.bcc-x .bcc-specs-head .bcc-specs-stroke {
    clip-path: inset(0 100% 0 0);
    transition: clip-path .8s var(--bcc-ease-settle) .2s
}

.bcc-x .bcc-specs-head.bcc-in .bcc-specs-stroke {
    clip-path: inset(0 0 0 0)
}

@media(prefers-reduced-motion:reduce) {
    .bcc-specs .bcc-specs-inner,
    .bcc-core-rain-drop {
        animation: none
    }
}