.pin {
    display: flex
}

.pin,.pin::before {
    box-sizing: border-box;
    position: absolute;
    z-index: 1
}

.pin::after,.pin::before {
    content: "";
    display: block
}

.pin::before {
    border-radius: 50%;
    margin: -1px;
    width: 3px;
    height: 3px
}

.pin .pin-caption {
    font-size: 12px;
    line-height: 1.3333733333;
    font-weight: 400;
    letter-spacing: -0.01em;
    font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.pin .pin-caption:lang(ar) {
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.pin .pin-caption:lang(ja) {
    font-family: SF Pro JP,SF Pro Text,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.pin .pin-caption:lang(ko) {
    font-family: SF Pro KR,SF Pro Text,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.pin .pin-caption:lang(th) {
    font-family: SF Pro TH,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.pin .pin-caption:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Text,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.pin .pin-caption:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.pin .pin-caption:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.pin .pin-caption:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Text,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.pin::after,.pin::before {
    background-color: #d2d2d7
}

.pin .pin-caption {
    color: #6e6e73
}

.pin-caption-left {
    text-align: left
}

.pin-caption-right {
    text-align: right
}

.pin-horizontal {
    left: 0;
    right: 0
}

.pin-horizontal,.pin-horizontal::after {
    height: 1px
}

.pin-horizontal::before {
    top: 0
}

.pin-horizontal::after {
    overflow: hidden;
    width: 100%
}

.pin-horizontal .pin-caption {
    margin-top: -0.6666866667em;
    max-width: 200px;
    white-space: nowrap
}

.pin-horizontal-left {
    flex-direction: row-reverse
}

.pin-horizontal-left::before {
    left: 0
}

.pin-horizontal-left .pin-caption {
    padding-left: 16px
}

.pin-horizontal-right {
    flex-direction: row
}

.pin-horizontal-right::before {
    right: 0
}

.pin-horizontal-right .pin-caption {
    padding-right: 16px
}

.pin-horizontal-inline-start {
    flex-direction: row-reverse
}

.pin-horizontal-inline-start::before {
    left: 0
}

.pin-horizontal-inline-start .pin-caption {
    padding-left: 16px
}

.pin-horizontal-inline-end {
    flex-direction: row
}

.pin-horizontal-inline-end::before {
    right: 0
}

.pin-horizontal-inline-end .pin-caption {
    padding-right: 16px
}

.pin-vertical {
    top: 0;
    bottom: 0
}

.pin-vertical,.pin-vertical::after {
    width: 1px
}

.pin-vertical::before {
    left: 0
}

.pin-vertical::after {
    height: 100%
}

.pin-vertical .pin-caption {
    margin-left: -100px;
    position: absolute;
    left: 0;
    width: 200px;
    text-align: center;
    z-index: 1
}

.pin-vertical .pin-caption-left,.pin-vertical .pin-caption-right {
    margin-left: 0
}

.pin-vertical .pin-caption-left {
    text-align: left
}

.pin-vertical .pin-caption-right {
    left: auto;
    right: 0;
    text-align: right
}

.pin-vertical-top {
    padding-bottom: 19.00048px
}

.pin-vertical-top::before {
    top: 0
}

.pin-vertical-top .pin-caption {
    top: 100%;
    margin-top: -16.00048px
}

.pin-vertical-bottom {
    padding-top: 19.00048px
}

.pin-vertical-bottom::before {
    bottom: 0
}

.pin-vertical-bottom .pin-caption {
    bottom: 100%;
    margin-bottom: -16.00048px
}

html.no-js picture[data-lazy] {
    display: none!important
}

html.js [data-anim-lazy-image],html.js [data-anim-lazy-image] * {
    background-image: none!important;
    mask-image: none!important
}

body {
    background-color: #000
}

.theme-dark {
    background-color: initial
}

@media only screen and (max-width: 734px) {
    .section-content {
        max-width:440px
    }
}

.headline-section {
    font-size: 120px;
    line-height: .9166666667;
    font-weight: 600;
    letter-spacing: -0.0166666667em;
    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    margin-top: 0;
    margin-bottom: 48px;
}

.headline-section:lang(ar) {
    letter-spacing: 0em;
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.headline-section:lang(ja) {
    letter-spacing: 0em;
    font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.headline-section:lang(ko) {
    letter-spacing: 0em;
    font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.headline-section:lang(zh) {
    letter-spacing: 0em
}

.headline-section:lang(th) {
    font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.headline-section:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.headline-section:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.headline-section:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.headline-section:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

@media only screen and (max-width: 1068px) {
    .headline-section {
        font-size:80px;
        line-height: .9;
        font-weight: 600;
        letter-spacing: -0.00625em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(ar) {
        letter-spacing: 0em;
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(ja) {
        letter-spacing: 0em;
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(ko) {
        letter-spacing: 0em;
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(zh) {
        letter-spacing: 0em
    }

    .headline-section:lang(th) {
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

@media only screen and (max-width: 734px) {
    .headline-section {
        font-size:52px;
        line-height: .9230769231;
        font-weight: 600;
        letter-spacing: 0em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(ja) {
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(ko) {
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(th) {
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

@media only screen and (max-width: 374px) {
    .headline-section {
        font-size:46px;
        line-height: .9132034783;
        font-weight: 600;
        letter-spacing: -0.0108695652em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(ar) {
        letter-spacing: 0em;
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(ja) {
        letter-spacing: 0em;
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(ko) {
        letter-spacing: 0em;
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(zh) {
        letter-spacing: 0em
    }

    .headline-section:lang(th) {
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .headline-section:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

@media only screen and (max-width: 1068px) {
    .headline-section {
        margin-bottom:44px
    }
}

@media only screen and (max-width: 734px) {
    .headline-section {
        margin-bottom:28px
    }
}

.eyebrow-section {
    font-size: 32px;
    line-height: 1.125;
    font-weight: 600;
    letter-spacing: .004em;
    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    margin-bottom: 24px
}

.eyebrow-section:lang(ja) {
    line-height: 1.21875;
    font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.eyebrow-section:lang(ko) {
    line-height: 1.21875;
    font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.eyebrow-section:lang(th) {
    line-height: 1.375;
    font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.eyebrow-section:lang(zh) {
    line-height: 1.21875
}

.eyebrow-section:lang(ar) {
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.eyebrow-section:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.eyebrow-section:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.eyebrow-section:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.eyebrow-section:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

@media only screen and (max-width: 1068px) {
    .eyebrow-section {
        font-size:24px;
        line-height: 1.1666666667;
        font-weight: 600;
        letter-spacing: 0em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .eyebrow-section:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .eyebrow-section:lang(ja) {
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .eyebrow-section:lang(ko) {
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .eyebrow-section:lang(th) {
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .eyebrow-section:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .eyebrow-section:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .eyebrow-section:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .eyebrow-section:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

@media only screen and (max-width: 1068px) {
    .eyebrow-section {
        margin-bottom:21px
    }
}

@media only screen and (max-width: 734px) {
    .eyebrow-section {
        margin-bottom:13px
    }
}

.intro-copy {
    font-size: 32px;
    line-height: 1.125;
    font-weight: 600;
    letter-spacing: .004em;
    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    margin-bottom: 114px
}

.intro-copy:lang(ja) {
    line-height: 1.21875;
    font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.intro-copy:lang(ko) {
    line-height: 1.21875;
    font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.intro-copy:lang(th) {
    line-height: 1.375;
    font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.intro-copy:lang(zh) {
    line-height: 1.21875
}

.intro-copy:lang(ar) {
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.intro-copy:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.intro-copy:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.intro-copy:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.intro-copy:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

@media only screen and (max-width: 1068px) {
    .intro-copy {
        font-size:24px;
        line-height: 1.1666666667;
        font-weight: 600;
        letter-spacing: 0em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .intro-copy:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .intro-copy:lang(ja) {
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .intro-copy:lang(ko) {
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .intro-copy:lang(th) {
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .intro-copy:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .intro-copy:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .intro-copy:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .intro-copy:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

@media only screen and (max-width: 1068px) {
    .intro-copy {
        margin-bottom:74px
    }
}

@media only screen and (max-width: 734px) {
    .intro-copy {
        margin-bottom:67px
    }
}

html.text-zoom .intro-copy {
    max-width: 100%
}

.proclaim {
    font-size: 28px;
    line-height: 1.1428571429;
    font-weight: 600;
    letter-spacing: .007em;
    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.proclaim:lang(ko) {
    line-height: 1.25;
    font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.proclaim:lang(th) {
    line-height: 1.3928571429;
    font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.proclaim:lang(zh) {
    line-height: 1.25
}

.proclaim:lang(ar) {
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.proclaim:lang(ja) {
    font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.proclaim:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.proclaim:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.proclaim:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.proclaim:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

@media only screen and (max-width: 1068px) {
    .proclaim {
        font-size:22px;
        line-height: 1.0909090909;
        font-weight: 600;
        letter-spacing: 0em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .proclaim:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .proclaim:lang(ja) {
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .proclaim:lang(ko) {
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .proclaim:lang(th) {
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .proclaim:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .proclaim:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .proclaim:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .proclaim:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

.bento-eyebrow {
    font-size: 17px;
    line-height: 1.2353641176;
    font-weight: 600;
    letter-spacing: 0em;
    font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    color: #e17630;
    display: block;
    margin-bottom: 17px
}

.bento-eyebrow:lang(ar) {
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.bento-eyebrow:lang(ja) {
    font-family: SF Pro JP,SF Pro Text,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.bento-eyebrow:lang(ko) {
    font-family: SF Pro KR,SF Pro Text,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.bento-eyebrow:lang(th) {
    font-family: SF Pro TH,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.bento-eyebrow:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Text,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.bento-eyebrow:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.bento-eyebrow:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.bento-eyebrow:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Text,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

@media only screen and (max-width: 1068px) {
    .bento-eyebrow {
        margin-bottom:13px
    }
}

@media only screen and (max-width: 734px) {
    .bento-eyebrow {
        margin-bottom:10px
    }
}

.bento-headline {
    font-size: 48px;
    line-height: 1.0834933333;
    font-weight: 600;
    letter-spacing: -0.003em;
    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    margin-bottom: 43px
}

.bento-headline:lang(ar) {
    letter-spacing: 0em;
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.bento-headline:lang(ja) {
    line-height: 1.1459933333;
    letter-spacing: 0em;
    font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.bento-headline:lang(ko) {
    line-height: 1.1875;
    letter-spacing: 0em;
    font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.bento-headline:lang(zh) {
    letter-spacing: 0em
}

.bento-headline:lang(th) {
    line-height: 1.3334933333;
    font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.bento-headline:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.bento-headline:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.bento-headline:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.bento-headline:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

@media only screen and (max-width: 1068px) {
    .bento-headline {
        font-size:40px;
        line-height: 1.1;
        font-weight: 600;
        letter-spacing: 0em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .bento-headline:lang(ja) {
        line-height: 1.175;
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .bento-headline:lang(ko) {
        line-height: 1.2;
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .bento-headline:lang(th) {
        line-height: 1.35;
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .bento-headline:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .bento-headline:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .bento-headline:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .bento-headline:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .bento-headline:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

@media only screen and (max-width: 1068px) {
    .bento-headline {
        margin-bottom:28px
    }
}

@media only screen and (max-width: 734px) {
    .bento-headline {
        margin-bottom:30px
    }
}

.bento-headline~.copy {
    margin-top: 0
}

.copy {
    font-size: 21px;
    line-height: 1.1904761905;
    font-weight: 600;
    letter-spacing: .011em;
    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.copy:lang(ja) {
    line-height: 1.2380952381;
    font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.copy:lang(ko) {
    line-height: 1.2858042857;
    font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.copy:lang(th) {
    line-height: 1.381002381;
    font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.copy:lang(zh) {
    line-height: 1.3334033333
}

.copy:lang(ar) {
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.copy:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.copy:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.copy:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.copy:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

@media only screen and (max-width: 1068px) {
    .copy {
        font-size:17px;
        line-height: 1.2353641176;
        font-weight: 600;
        letter-spacing: 0em;
        font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .copy:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .copy:lang(ja) {
        font-family: SF Pro JP,SF Pro Text,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .copy:lang(ko) {
        font-family: SF Pro KR,SF Pro Text,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .copy:lang(th) {
        font-family: SF Pro TH,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .copy:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Text,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .copy:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .copy:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .copy:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Text,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

@media only screen and (max-width: 734px) {
    .copy {
        font-size:15px;
        line-height: 1.2666666667;
        font-weight: 600;
        letter-spacing: 0em;
        font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .copy:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .copy:lang(ja) {
        font-family: SF Pro JP,SF Pro Text,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .copy:lang(ko) {
        font-family: SF Pro KR,SF Pro Text,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .copy:lang(th) {
        font-family: SF Pro TH,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .copy:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Text,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .copy:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .copy:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .copy:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Text,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

.copy,.gray-text,.proclaim {
    color: #6e6e73
}

.copy strong,.gray-text strong,.proclaim strong {
    color: #f5f5f7
}

.copy strong.green-text,.gray-text strong.green-text,.green-text,.proclaim strong.green-text {
    color: #e17630
}

.factoid {
    font-size: 21px;
    line-height: 1.1904761905;
    font-weight: 600;
    letter-spacing: .011em;
    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    text-align: center
}

.factoid:lang(ja) {
    line-height: 1.2380952381;
    font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid:lang(ko) {
    line-height: 1.2858042857;
    font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid:lang(th) {
    line-height: 1.381002381;
    font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid:lang(zh) {
    line-height: 1.3334033333
}

.factoid:lang(ar) {
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

@media only screen and (max-width: 1068px) {
    .factoid {
        font-size:17px;
        line-height: 1.2353641176;
        font-weight: 600;
        letter-spacing: 0em;
        font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid:lang(ja) {
        font-family: SF Pro JP,SF Pro Text,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid:lang(ko) {
        font-family: SF Pro KR,SF Pro Text,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid:lang(th) {
        font-family: SF Pro TH,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Text,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Text,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

.factoid .stat {
    display: block
}

.factoid .stat-number {
    font-size: 80px;
    line-height: .9166666667;
    font-weight: 600;
    letter-spacing: -0.0166666667em;
    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    display: inline-block;
    padding-bottom: 0
}

.factoid .stat-number:lang(ar) {
    letter-spacing: 0em;
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid .stat-number:lang(ja) {
    letter-spacing: 0em;
    font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid .stat-number:lang(ko) {
    letter-spacing: 0em;
    font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid .stat-number:lang(zh) {
    letter-spacing: 0em
}

.factoid .stat-number:lang(th) {
    font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid .stat-number:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid .stat-number:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid .stat-number:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid .stat-number:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

@media only screen and (max-width: 1068px) {
    .factoid .stat-number {
        font-size: 60px;
        line-height: 1;
        font-weight: 600;
        letter-spacing: 0em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-number:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-number:lang(ja) {
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-number:lang(ko) {
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-number:lang(th) {
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-number:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-number:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-number:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-number:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

@media only screen and (max-width: 734px) {
    .factoid .stat-number {
        font-size:72px;
        line-height: 1;
        font-weight: 600;
        letter-spacing: 0em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-number:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-number:lang(ja) {
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-number:lang(ko) {
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-number:lang(th) {
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-number:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-number:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-number:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-number:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

.factoid .stat-number-punctuation {
    font-size: .66em
}

.factoid .stat-unit {
    font-size: 48px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: 0em;
    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid .stat-unit:lang(ar) {
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid .stat-unit:lang(ja) {
    font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid .stat-unit:lang(ko) {
    font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid .stat-unit:lang(th) {
    font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid .stat-unit:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid .stat-unit:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid .stat-unit:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.factoid .stat-unit:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

@media only screen and (max-width: 1068px) {
    .factoid .stat-unit {
        font-size:52px;
        line-height: 1;
        font-weight: 600;
        letter-spacing: 0em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-unit:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-unit:lang(ja) {
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-unit:lang(ko) {
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-unit:lang(th) {
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-unit:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-unit:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-unit:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-unit:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

@media only screen and (max-width: 734px) {
    .factoid .stat-unit {
        font-size:52px;
        line-height: 1;
        font-weight: 600;
        letter-spacing: 0em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-unit:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-unit:lang(ja) {
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-unit:lang(ko) {
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-unit:lang(th) {
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-unit:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-unit:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-unit:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .factoid .stat-unit:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

.bento-container {
    overflow: hidden;
    position: relative
}

.bento-container:not(.bento-borderless):after,.bento-container:not(.bento-borderless):before {
    content: "";
    border-top: 1px solid #424245;
    position: absolute;
    width: 100%
}

.bento-container:not(.bento-borderless):after {
    bottom: 0
}

.bento-container.bento-borderless-top:before {
    border: none
}

.bento {
    background-color: #424245;
    border: 1px solid #424245;
    display: grid;
    grid-gap: 0px;
    grid-template-columns: 1fr 1fr;
    justify-items: stretch;
    width: 100%;
    position: relative;
    left: -1px;
    margin-left: auto;
    margin-right: auto;
    max-width: 2000px
}

@media only screen and (max-width: 1068px) {
    .bento {
        max-width:770px
    }
}

.bento-borderless .bento {
    background-color: initial;
    border: initial
}

.bento-borderless-top .bento {
    border-top: initial
}

.bento-borderless-top .bento-cell {
    padding: 105px 6.5vw 117px
}

@media only screen and (max-width: 1068px) {
    .bento-borderless-top .bento-cell {
        padding:0px 6.5vw
    }
}

@media only screen and (max-width: 734px) {
    .bento-borderless-top .bento-cell {
        padding:60px 6.25%
    }
}

.bento-cell {
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #000;
    padding: 7.5vw 6vw;
    position: relative;
    overflow: hidden
}

@media only screen and (max-width: 1068px) {
    .bento-cell {
        padding:102px 52px
    }
}

@media only screen and (max-width: 734px) {
    .bento-cell {
        padding:60px 6.25%
    }

    .bento-cell.bento-cell {
        grid-template-columns: 1fr 1fr;
        grid-column-start: auto;
        grid-row: auto;
        grid-column: 1/span 2
    }
}

.bento-cell-full {
    grid-column-end: span 2
}

.bento-cell-tall {
    min-height: 640px
}

@media only screen and (max-width: 1068px) {
    .bento-cell-tall {
        min-height:440px
    }
}

@media only screen and (max-width: 734px) {
    .bento-cell-tall {
        min-height:400px
    }
}

@media only screen and (max-width: 734px) {
    .bento-cell-tall-small {
        padding-top:115px;
        padding-bottom: 115px
    }
}

@media only screen and (max-width: 734px) {
    .bento-cell-short-small {
        min-height:400px
    }
}

.bento-cell-copy {
    margin-left: auto;
    margin-right: auto
}

@media only screen and (max-width: 734px) {
    .bento-cell-copy {
        max-width:440px
    }
}

.bento-bg-picture,.bento-bg-video-container {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

.bento-bg-picture~*,.bento-bg-video-container~* {
    position: relative
}

.bento-bg-picture img,.bento-bg-video-container video {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.bento-bg-picture+noscript {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.play-pause-button {
    font-weight: 300;
    color: rgba(245,245,247,.75);
    font-size: 25px;
    padding: 3px 5px;
    right: 20px;
    --play-pause-bottom-offset: 22px;
    bottom: var(--play-pause-bottom-offset)
}

@media only screen and (orientation: landscape) {
    html.mq-medium-shorter.touch .play-pause-button {
        --play-pause-bottom-offset:55px
    }

    @supports(transform: translateY(calc(100dvh - 100vh))) {
        html.mq-medium-shorter.touch .play-pause-button {
            transform:translateY(calc(100dvh - 100vh))
        }
    }
}

@media only screen and (max-width: 734px) {
    .play-pause-button {
        font-size:20px;
        right: 7px
    }

    .play-pause-button.play-pause-button-value-props,.play-pause-button.play-pause-button-xray {
        top: var(--play-pause-bottom-offset);
        bottom: auto
    }
}

.play-pause-button:hover {
    opacity: .8
}

.play-pause-button:active {
    opacity: .65
}

.play-pause-button .slot-loading,.play-pause-button .slot-pause,.play-pause-button .slot-play,.play-pause-button .slot-replay {
    display: none
}

.play-pause-button.loading .slot-loading,.play-pause-button.pause .slot-pause,.play-pause-button.play .slot-play,.play-pause-button.replay .slot-replay {
    display: block
}

.play-pause-button .icon:after {
    padding: 0
}

.play-pause-button:disabled {
    opacity: 0
}

.router {
    text-align: left
}

html.text-zoom .router .section-headline {
    font-size: 32px;
    line-height: 34px
}

.router .cta {
    display: inline-block;
    margin-top: .8em
}

@media only screen and (max-width: 1068px) {
    .router .cta {
        margin-top:10px
    }
}

@media only screen and (max-width: 734px) {
    .router .cta {
        margin-top:7px
    }
}

.router .section-content.row {
    justify-content: space-between
}

@media only screen and (max-width: 734px) {
    .router .section-content.row {
        flex-direction:column;
        align-items: center
    }
}

.router .section-intro.typography-intro {
    margin-top: .8em
}

@media only screen and (max-width: 1068px) {
    .router .section-intro.typography-intro {
        margin-top:9px;
        max-width: 270px
    }
}

@media only screen and (max-width: 734px) {
    .router .section-intro.typography-intro {
        margin-top:7px;
        max-width: 290px
    }
}

@media only screen and (max-width: 734px) {
    .router .column-copy {
        max-width:290px;
        margin-bottom: 33px
    }
}

.pin {
    will-change: transform,opacity
}

.pin::before {
    height: 7px;
    width: 7px;
    margin: -3px
}

.pin-vertical-bottom {
    padding-top: 0
}

.pin-vertical-top {
    padding-bottom: 0
}

html.enhanced .fallback-image,html.no-enhanced .hide-on-static,html.no-js .hide-on-static {
    display: none
}

.flex-column-center {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

html.js picture:not(.loaded),html.js picture:not(.loaded) img {
    mask-image: none!important
}

.no-pointer {
    pointer-events: none
}

.yes-pointer {
    pointer-events: auto
}

.ribbon-container {
    height: 100svh;
    width: 100%;
    position: fixed;
    z-index: 2;
    pointer-events: none;
    opacity: 0
}

@media only screen and (max-width: 1068px) {
    html.ac-gn-segmentbar-visible .ribbon-container,html.ac-ls-visible .ribbon-container {
        position:relative;
        height: auto;
        min-height: auto!important
    }

    html.ac-gn-segmentbar-visible .ribbon-container .ribbon,html.ac-ls-visible .ribbon-container .ribbon {
        position: relative;
        top: 0;
        bottom: auto
    }
}

html.mq-large-short .ribbon-container,html.mq-medium-shorter .ribbon-container,html.mq-small-shortest .ribbon-container,html.mq-xlarge-short .ribbon-container,html.no-enhanced .ribbon-container,html.text-zoom .ribbon-container {
    position: absolute;
    opacity: 1
}

@media only screen and (orientation: landscape) {
    html.mq-large-short .ribbon-container,html.mq-medium-shorter .ribbon-container,html.mq-small-shortest .ribbon-container,html.mq-xlarge-short .ribbon-container,html.no-enhanced .ribbon-container,html.text-zoom .ribbon-container {
        min-height:50vw
    }
}

@media only screen and (orientation: landscape)and (min-width:1441px) {
    html.mq-large-short .ribbon-container,html.mq-medium-shorter .ribbon-container,html.mq-small-shortest .ribbon-container,html.mq-xlarge-short .ribbon-container,html.no-enhanced .ribbon-container,html.text-zoom .ribbon-container {
        min-height:41vw
    }
}

@media only screen and (max-width: 734px) {
    html.mq-large-short .ribbon-container,html.mq-medium-shorter .ribbon-container,html.mq-small-shortest .ribbon-container,html.mq-xlarge-short .ribbon-container,html.no-enhanced .ribbon-container,html.text-zoom .ribbon-container {
        min-height:565px
    }
}

.ribbon-container .ribbon {
    bottom: calc(var(--r-localnav-height) + var(--r-globalnav-segmentbar-height) + var(--r-localeswitcher-height, 0px))
}

html.mq-large-short .ribbon-container .ribbon,html.mq-medium-shorter .ribbon-container .ribbon,html.mq-small-shortest .ribbon-container .ribbon,html.mq-xlarge-short .ribbon-container .ribbon,html.no-enhanced .ribbon-container .ribbon {
    bottom: 96px
}

html.text-zoom .ribbon-container .ribbon {
    bottom: 153px
}

.ribbon-container .ribbon-elevated .ribbon-content {
    font-weight: 600
}

.ribbon-container .ribbon-elevated a {
    pointer-events: auto
}

html.mq-small-short .ribbon-container .ribbon-elevated p {
    font-size: 14px;
    line-height: 1.4285914286;
    font-weight: 400;
    letter-spacing: -0.016em;
    font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    font-weight: 600
}

html.mq-small-short .ribbon-container .ribbon-elevated p:lang(ar) {
    letter-spacing: 0em;
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

html.mq-small-short .ribbon-container .ribbon-elevated p:lang(ja) {
    letter-spacing: 0em;
    font-family: SF Pro JP,SF Pro Text,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

html.mq-small-short .ribbon-container .ribbon-elevated p:lang(ko) {
    line-height: 1.5714285714;
    letter-spacing: 0em;
    font-family: SF Pro KR,SF Pro Text,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

html.mq-small-short .ribbon-container .ribbon-elevated p:lang(zh) {
    line-height: 1.5;
    letter-spacing: 0em
}

html.mq-small-short .ribbon-container .ribbon-elevated p:lang(th) {
    line-height: 1.3571828571;
    letter-spacing: 0em;
    font-family: SF Pro TH,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

html.mq-small-short .ribbon-container .ribbon-elevated p:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Text,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

html.mq-small-short .ribbon-container .ribbon-elevated p:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

html.mq-small-short .ribbon-container .ribbon-elevated p:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

html.mq-small-short .ribbon-container .ribbon-elevated p:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Text,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ribbon-container.theme-dark .ribbon .ribbon-link {
    color: #fff
}

.ribbon-container.is-hidden a {
    pointer-events: none;
    cursor: default
}

.section-hero {
    --hero-offset: -3vh;
    margin-top: calc(var(--r-globalnav-height, 0px)*-1)
}

@media only screen and (orientation: landscape)and (max-height:55vw) {
    .section-hero {
        --hero-offset:0px
    }
}

@media only screen and (orientation: landscape)and (max-height:45vw) {
    .section-hero {
        --hero-offset:2vh
    }
}

@media only screen and (max-width: 1068px) {
    .section-hero {
        --hero-offset:3vh
    }
}

@media only screen and (max-width: 1068px)and (orientation:portrait) {
    .section-hero {
        --hero-offset:142px
    }
}

@media only screen and (max-width: 734px) {
    .section-hero {
        --hero-offset:91px
    }
}

@media only screen and (max-width: 405px) {
    html.mq-large-short .section-hero,html.mq-medium-shorter .section-hero,html.mq-small-shortest .section-hero,html.mq-xlarge-short .section-hero,html.no-enhanced .section-hero,html.no-heavy-media .section-hero,html.no-js .section-hero,html.text-zoom .section-hero {
        --hero-offset:111px
    }
}

html.mq-large-short .section-hero,html.mq-medium-shorter .section-hero,html.mq-small-shortest .section-hero,html.mq-xlarge-short .section-hero {
    pointer-events: none
}

html.mq-large-short .section-hero,html.mq-medium-shorter .section-hero,html.mq-small-shortest .section-hero,html.mq-xlarge-short .section-hero,html.no-enhanced .section-hero,html.no-heavy-media .section-hero,html.no-js .section-hero,html.text-zoom .section-hero {
    margin-top: 0
}

@media only screen and (max-width: 734px) {
    html.ac-gn-segmentbar-visible.touch .section-hero,html.ac-ls-visible.touch .section-hero {
        --hero-offset:150px
    }
}

@media only screen and (max-width: 734px)and (min-height:980px) {
    html.ac-gn-segmentbar-visible.touch .section-hero,html.ac-ls-visible.touch .section-hero {
        --hero-offset:40px
    }
}

.hero-intro-copy {
    height: 100%;
    width: 100%;
    position: relative;
    overflow: hidden
}

@media only screen and (max-width: 734px) {
    .hero-intro-copy {
        z-index:1
    }
}

.hero-lockup {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 100%;
    position: relative;
    top: var(--hero-offset);
    text-align: center
}

@media only screen and (max-width: 734px) {
    .hero-lockup {
        flex-direction:column
    }
}

.hero-lockup-inner {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center
}

.hero-eyebrow,.hero-links-anim {
    --extra-offset: 58px;
    --eyebrow-offset: calc(-0.85882vw + -0.6em + var(--extra-offset)*-1);
    --trans-y: 50px
}

@media only screen and (max-width: 1068px) {
    .hero-eyebrow,.hero-links-anim {
        --trans-y:25px
    }
}

@media only screen and (max-width: 734px) {
    .hero-eyebrow,.hero-links-anim {
        --trans-y:15px;
        --eyebrow-offset: -53px
    }
}

.hero-eyebrow {
    font-size: 30px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: 0em;
    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    color: #e17630;
    position: absolute;
    top: var(--eyebrow-offset)
}

.hero-eyebrow:lang(ar) {
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-eyebrow:lang(ja) {
    font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-eyebrow:lang(ko) {
    font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-eyebrow:lang(th) {
    font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-eyebrow:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-eyebrow:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-eyebrow:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-eyebrow:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

@media only screen and (max-width: 1068px) {
    .hero-eyebrow {
        font-size:28px;
        line-height: 1.1428571429;
        font-weight: 600;
        letter-spacing: .007em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-eyebrow:lang(ko) {
        line-height: 1.25;
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-eyebrow:lang(th) {
        line-height: 1.3928571429;
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-eyebrow:lang(zh) {
        line-height: 1.25
    }

    .hero-eyebrow:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-eyebrow:lang(ja) {
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-eyebrow:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-eyebrow:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-eyebrow:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-eyebrow:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

@media only screen and (max-width: 734px) {
    .hero-eyebrow {
        font-size:24px;
        line-height: 1.1666666667;
        font-weight: 600;
        letter-spacing: 0em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-eyebrow:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-eyebrow:lang(ja) {
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-eyebrow:lang(ko) {
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-eyebrow:lang(th) {
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-eyebrow:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-eyebrow:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-eyebrow:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-eyebrow:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

@media only screen and (min-width: 735px)and (max-width:1068px) {
    .hero-eyebrow {
        --extra-offset:42px
    }
}

@media only screen and (min-width: 735px)and (max-width:1068px)and (orientation:portrait) {
    .hero-eyebrow {
        top:-70px
    }
}

.hero-headline {
    font-size: 190px;
    line-height: 1;
    font-weight: 700;
    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    line-height: .7;
    letter-spacing: -0.0210526316em;
    position: relative;
    left: -0.25vw;
    margin-top: 0;
    margin-bottom: 0
}

.hero-headline:lang(ar) {
    letter-spacing: 0em;
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-headline:lang(ja) {
    letter-spacing: 0em;
    font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-headline:lang(ko) {
    letter-spacing: 0em;
    font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-headline:lang(zh) {
    font-weight: 600;
    letter-spacing: 0em
}

.hero-headline:lang(th) {
    font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-headline:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-headline:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-headline:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-headline:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

@media only screen and (min-width: 735px) {
    .hero-headline {
        font-size: 8vw;
    }
}

@media only screen and (max-width: 1068px)and (orientation:portrait) {
    .hero-headline {
        font-size: 72px;
    }
}

@media only screen and (max-width: 734px) {
    .hero-headline {
        font-size: 36px;
    }
}

html.text-zoom .hero-headline {
    font-size: 8.5vw
}

html.aow .hero-headline {
    margin-top: -0.05em
}

.hero-headline-svg {
    height: .753em;
    color: #fff;
    fill: currentColor;
    position: relative;
    top: .04em;
    left: .01em
}

.hero-links {
    font-size: 22px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: -0.007em;
    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-links:lang(ar) {
    letter-spacing: 0em;
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-links:lang(ja) {
    letter-spacing: 0em;
    font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-links:lang(ko) {
    letter-spacing: 0em;
    font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-links:lang(zh) {
    letter-spacing: 0em
}

.hero-links:lang(th) {
    font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-links:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-links:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-links:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-links:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

@media only screen and (max-width: 734px) {
    .hero-links {
        font-size:18px;
        line-height: 1;
        font-weight: 600;
        letter-spacing: -0.005em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-links:lang(ar) {
        letter-spacing: 0em;
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-links:lang(ja) {
        letter-spacing: 0em;
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-links:lang(ko) {
        letter-spacing: 0em;
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-links:lang(zh) {
        letter-spacing: 0em
    }

    .hero-links:lang(th) {
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-links:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-links:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-links:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-links:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

@media only screen and (max-width: 374px) {
    .hero-links {
        width:75%;
        margin-left: auto;
        margin-right: auto
    }

    .hero-links li {
        margin-left: 0;
        margin-right: 0;
        display: block
    }

    .hero-links li:first-child {
        margin-bottom: 10px
    }
}

html.mq-large-short .hero-links,html.mq-medium-shorter .hero-links,html.mq-small-shortest .hero-links,html.mq-xlarge-short .hero-links {
    pointer-events: auto
}

@media only screen and (max-width: 734px) {
    .hero-links.campaign-update li {
        margin:0;
        display: block
    }

    .hero-links.campaign-update li+li {
        margin-top: .4em
    }
}

.hero-links--no-copy {
    position: absolute;
    bottom: var(--eyebrow-offset)
}

@media only screen and (min-width: 735px)and (max-width:1068px) {
    .hero-links--no-copy {
        --extra-offset:40px
    }
}

@media only screen and (min-width: 735px)and (max-width:1068px)and (orientation:portrait) {
    .hero-links--no-copy {
        bottom:-62px
    }
}

.hero-announce {
    --announce-bottom-offset: 140px;
    --announce-top-offset: 146px;
    min-width: 350px;
    width: 100%;
    text-align: center;
    position: absolute;
    margin-top: 0;
    top: calc(50% - var(--hero-offset) + 50vh - var(--announce-bottom-offset) - env(safe-area-inset-bottom))
}

html.mq-large-short .hero-announce,html.mq-medium-shorter .hero-announce,html.mq-small-shortest .hero-announce,html.mq-xlarge-short .hero-announce {
    --announce-top-offset: 170px;
    top: calc(var(--eyebrow-offset)*-1 + var(--announce-top-offset))
}

@media only screen and (max-width: 1068px) {
    html.mq-large-short .hero-announce,html.mq-medium-shorter .hero-announce,html.mq-small-shortest .hero-announce,html.mq-xlarge-short .hero-announce {
        --announce-top-offset:85px
    }
}

@media only screen and (max-width: 734px) {
    html.mq-large-short .hero-announce,html.mq-medium-shorter .hero-announce,html.mq-small-shortest .hero-announce,html.mq-xlarge-short .hero-announce {
        --announce-top-offset:17px
    }
}

@media only screen and (max-width: 1068px) {
    .hero-announce {
        --announce-bottom-offset:120px
    }
}

@media only screen and (max-width: 1068px)and (max-height:470px) {
    .hero-announce {
        --announce-bottom-offset:110px
    }
}

@media only screen and (max-width: 734px) {
    .hero-announce {
        --announce-top-offset:29px;
        top: calc(var(--eyebrow-offset)*-1 + var(--announce-top-offset));
        position: absolute;
        bottom: auto;
        margin: 0
    }
}

@media only screen and (max-width: 374px) {
    .hero-announce {
        min-width:unset
    }
}

.hero-copy {
    font-size: 17px;
    line-height: 1.2353641176;
    font-weight: 400;
    letter-spacing: 0em;
    font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px
}

.hero-copy:lang(ar) {
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-copy:lang(ja) {
    font-family: SF Pro JP,SF Pro Text,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-copy:lang(ko) {
    font-family: SF Pro KR,SF Pro Text,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-copy:lang(th) {
    font-family: SF Pro TH,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-copy:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Text,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-copy:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-copy:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-copy:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Text,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

@media only screen and (max-width: 1068px) {
    .hero-copy {
        font-size:17px;
        line-height: 1.2353641176;
        font-weight: 400;
        letter-spacing: 0em;
        font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-copy:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-copy:lang(ja) {
        font-family: SF Pro JP,SF Pro Text,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-copy:lang(ko) {
        font-family: SF Pro KR,SF Pro Text,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-copy:lang(th) {
        font-family: SF Pro TH,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-copy:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Text,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-copy:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-copy:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-copy:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Text,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

@media only screen and (max-width: 734px) {
    .hero-copy {
        font-size:17px;
        line-height: 1.2353641176;
        font-weight: 400;
        letter-spacing: 0em;
        font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-copy:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-copy:lang(ja) {
        font-family: SF Pro JP,SF Pro Text,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-copy:lang(ko) {
        font-family: SF Pro KR,SF Pro Text,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-copy:lang(th) {
        font-family: SF Pro TH,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-copy:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Text,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-copy:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-copy:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-copy:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Text,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

@media only screen and (max-width: 734px) {
    .hero-copy {
        max-width:350px
    }
}

.hero-cta .icon,.hero-cta .icon-copy {
    color: #fff
}

.hero-payoff {
    font-size: 120px;
    line-height: .9166666667;
    font-weight: 700;
    letter-spacing: -0.025em;
    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    box-sizing: border-box;
    width: 100%;
    padding-left: 3vh;
    padding-right: 3vh;
    text-align: center;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.hero-payoff:lang(ar) {
    letter-spacing: 0em;
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-payoff:lang(ja) {
    letter-spacing: 0em;
    font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-payoff:lang(ko) {
    letter-spacing: 0em;
    font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-payoff:lang(zh) {
    font-weight: 600;
    letter-spacing: 0em
}

.hero-payoff:lang(th) {
    font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-payoff:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-payoff:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-payoff:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.hero-payoff:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

@media only screen and (max-width: 1068px) {
    .hero-payoff {
        font-size:80px;
        line-height: .9;
        font-weight: 700;
        letter-spacing: 0em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-payoff:lang(zh) {
        font-weight: 600
    }

    .hero-payoff:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-payoff:lang(ja) {
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-payoff:lang(ko) {
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-payoff:lang(th) {
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-payoff:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-payoff:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-payoff:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-payoff:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

@media only screen and (max-width: 734px) {
    .hero-payoff {
        font-size:40px;
        line-height: 1.1;
        font-weight: 700;
        letter-spacing: 0em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-payoff:lang(zh) {
        font-weight: 600
    }

    .hero-payoff:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-payoff:lang(ja) {
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-payoff:lang(ko) {
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-payoff:lang(th) {
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-payoff:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-payoff:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-payoff:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .hero-payoff:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

.hero-payoff:not(.yes-pointer) {
    pointer-events: none
}

html.text-zoom .hero-payoff {
    font-size: 48px;
    line-height: 1.0834933333;
    font-weight: 600;
    letter-spacing: -0.003em;
    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

html.text-zoom .hero-payoff:lang(ar) {
    letter-spacing: 0em;
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

html.text-zoom .hero-payoff:lang(ja) {
    line-height: 1.1459933333;
    letter-spacing: 0em;
    font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

html.text-zoom .hero-payoff:lang(ko) {
    line-height: 1.1875;
    letter-spacing: 0em;
    font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

html.text-zoom .hero-payoff:lang(zh) {
    letter-spacing: 0em
}

html.text-zoom .hero-payoff:lang(th) {
    line-height: 1.3334933333;
    font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

html.text-zoom .hero-payoff:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

html.text-zoom .hero-payoff:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

html.text-zoom .hero-payoff:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

html.text-zoom .hero-payoff:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

@media only screen and (max-width: 1068px) {
    html.text-zoom .hero-payoff {
        font-size:40px;
        line-height: 1.1;
        font-weight: 600;
        letter-spacing: 0em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    html.text-zoom .hero-payoff:lang(ja) {
        line-height: 1.175;
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    html.text-zoom .hero-payoff:lang(ko) {
        line-height: 1.2;
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    html.text-zoom .hero-payoff:lang(th) {
        line-height: 1.35;
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    html.text-zoom .hero-payoff:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    html.text-zoom .hero-payoff:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    html.text-zoom .hero-payoff:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    html.text-zoom .hero-payoff:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    html.text-zoom .hero-payoff:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

@media only screen and (max-width: 734px) {
    html.text-zoom .hero-payoff {
        font-size:32px;
        line-height: 1.125;
        font-weight: 600;
        letter-spacing: .004em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    html.text-zoom .hero-payoff:lang(ja) {
        line-height: 1.21875;
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    html.text-zoom .hero-payoff:lang(ko) {
        line-height: 1.21875;
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    html.text-zoom .hero-payoff:lang(th) {
        line-height: 1.375;
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    html.text-zoom .hero-payoff:lang(zh) {
        line-height: 1.21875
    }

    html.text-zoom .hero-payoff:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    html.text-zoom .hero-payoff:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    html.text-zoom .hero-payoff:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    html.text-zoom .hero-payoff:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    html.text-zoom .hero-payoff:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

html.mq-large-short .hero-payoff,html.mq-medium-shorter .hero-payoff,html.mq-small-shortest .hero-payoff,html.mq-xlarge-short .hero-payoff,html.no-enhanced .hero-payoff,html.no-heavy-media .hero-payoff,html.no-js .hero-payoff,html.text-zoom .hero-payoff {
    opacity: 1;
    position: static;
    height: auto;
    margin-top: 15vh;
    margin-bottom: 128px;
    pointer-events: auto
}

@media only screen and (max-width: 734px) {
    html.mq-large-short .hero-payoff,html.mq-medium-shorter .hero-payoff,html.mq-small-shortest .hero-payoff,html.mq-xlarge-short .hero-payoff,html.no-enhanced .hero-payoff,html.no-heavy-media .hero-payoff,html.no-js .hero-payoff,html.text-zoom .hero-payoff {
        margin-top:100px
    }
}

html.mq-large-short .hero-payoff,html.mq-medium-shorter .hero-payoff,html.mq-small-shortest .hero-payoff,html.mq-xlarge-short .hero-payoff {
    margin-top: 20vh;
    pointer-events: none
}

.scroll-container-hero {
    position: relative;
    height: 230vh
}

html.mq-large-short .scroll-container-hero,html.mq-medium-shorter .scroll-container-hero,html.mq-small-shortest .scroll-container-hero,html.mq-xlarge-short .scroll-container-hero,html.no-enhanced .scroll-container-hero,html.no-heavy-media .scroll-container-hero,html.no-js .scroll-container-hero,html.text-zoom .scroll-container-hero {
    height: auto
}

.sticky-hero {
    position: relative;
    height: calc(100vh - var(--r-localnav-height, 0px));
    position: sticky;
    top: calc(var(--r-localnav-height, 0px))
}

html.mq-large-short .sticky-hero,html.mq-medium-shorter .sticky-hero,html.mq-small-shortest .sticky-hero,html.mq-xlarge-short .sticky-hero,html.no-enhanced .sticky-hero,html.no-heavy-media .sticky-hero,html.no-js .sticky-hero,html.text-zoom .sticky-hero {
    height: auto;
    position: relative;
    top: calc(var(--r-localnav-height, 0px)*-1)
}

.image-sequence-container-hero {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
    position: absolute;
    top: 0;
    overflow: hidden
}

html.mq-large-short .hero-lockup,html.mq-large-short .image-sequence-container-hero,html.mq-medium-shorter .hero-lockup,html.mq-medium-shorter .image-sequence-container-hero,html.mq-small-shortest .hero-lockup,html.mq-small-shortest .image-sequence-container-hero,html.mq-xlarge-short .hero-lockup,html.mq-xlarge-short .image-sequence-container-hero,html.no-enhanced .hero-lockup,html.no-enhanced .image-sequence-container-hero,html.no-heavy-media .hero-lockup,html.no-heavy-media .image-sequence-container-hero,html.no-js .hero-lockup,html.no-js .image-sequence-container-hero,html.text-zoom .hero-lockup,html.text-zoom .image-sequence-container-hero {
    height: calc(100vh - var(--r-localnav-height, 0px))
}

@media only screen and (orientation: landscape) {
    .hero-lockup,.image-sequence-container-hero {
        min-height:50vw
    }
}

@media only screen and (orientation: landscape)and (min-width:1441px) {
    .hero-lockup,.image-sequence-container-hero {
        min-height:41vw
    }
}

@media only screen and (max-width: 734px) {
    .hero-lockup,.image-sequence-container-hero {
        min-height:500px
    }
}

.image-sequence-container-inner-hero {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    position: relative;
    top: var(--hero-offset);
    --translate-offset: 8;
    transform: translateY(calc(var(--translate-offset)*1%));
    padding-bottom: 34.8148148148%
}

@media only screen and (max-width: 1068px) {
    .image-sequence-container-inner-hero {
        top:calc(var(--hero-offset) + 10px)
    }
}

@media only screen and (max-width: 1068px)and (orientation:portrait) {
    .image-sequence-container-inner-hero {
        top:calc(var(--hero-offset) - 317px);
        transform: none;
        --translate-offset: 0;
        padding-bottom: 0
    }
}

@media only screen and (max-width: 734px) {
    .image-sequence-container-inner-hero {
        top:calc(var(--hero-offset) - 213px);
        transform: none;
        --translate-offset: 0;
        padding-bottom: 0
    }
}

.image-sequence-container-inner-hero noscript {
    width: 100%
}

.image-sequence-hero {
    display: block;
    transform-origin: 50% 67%;
    opacity: 0;
    transition: opacity 200ms
}

.hero-ready .image-sequence-hero {
    transform-origin: 50% 100%
}

html.mq-large-short .image-sequence-hero,html.mq-medium-shorter .image-sequence-hero,html.mq-small-shortest .image-sequence-hero,html.mq-xlarge-short .image-sequence-hero,html.no-enhanced .image-sequence-hero,html.no-heavy-media .image-sequence-hero,html.no-js .image-sequence-hero,html.text-zoom .image-sequence-hero {
    display: none
}

.hero-fallback-pic img,.image-sequence-hero {
    width: 100%
}

@media only screen and (max-width: 1068px)and (orientation:portrait) {
    .hero-fallback-pic img,.image-sequence-hero {
        width:auto
    }
}

@media only screen and (max-width: 734px) {
    .hero-fallback-pic img,.image-sequence-hero {
        width:auto
    }
}

.hero-fallback-pic {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%
}

html.enhanced.no-mq-small-shortest.no-mq-medium-shorter.no-mq-large-short.no-mq-xlarge-short.heavy-media:not(.text-zoom) .hero-fallback-pic {
    display: none
}

html.js.enhanced .hero-fallback-pic {
    opacity: 0;
    transition: opacity 200ms
}

html.js.enhanced .hero-fallback-pic.loaded {
    opacity: 1
}

.near-section .hero-eyebrow,.near-section .hero-headline,.near-section .hero-links-anim,.near-section .hero-payoff,.near-section .image-sequence-hero {
    will-change: transform,opacity
}

html.enhanced .hero-eyebrow,html.enhanced .hero-headline,html.enhanced .hero-links-anim,html.no-heavy-media .hero-eyebrow,html.no-heavy-media .hero-headline,html.no-heavy-media .hero-links-anim {
    opacity: 0
}

html.enhanced .hero-ready .hero-eyebrow,html.enhanced .hero-ready .hero-headline,html.enhanced .hero-ready .hero-links-anim,html.mq-large-short .hero-eyebrow,html.mq-large-short .hero-headline,html.mq-large-short .hero-links-anim,html.mq-medium-shorter .hero-eyebrow,html.mq-medium-shorter .hero-headline,html.mq-medium-shorter .hero-links-anim,html.mq-small-shortest .hero-eyebrow,html.mq-small-shortest .hero-headline,html.mq-small-shortest .hero-links-anim,html.mq-xlarge-short .hero-eyebrow,html.mq-xlarge-short .hero-headline,html.mq-xlarge-short .hero-links-anim,html.no-enhanced .hero-eyebrow,html.no-enhanced .hero-headline,html.no-enhanced .hero-links-anim,html.no-heavy-media .hero-ready .hero-eyebrow,html.no-heavy-media .hero-ready .hero-headline,html.no-heavy-media .hero-ready .hero-links-anim,html.no-js .hero-eyebrow,html.no-js .hero-headline,html.no-js .hero-links-anim,html.text-zoom .hero-eyebrow,html.text-zoom .hero-headline,html.text-zoom .hero-links-anim {
    opacity: 1
}

.section-value-props {
    position: relative;
    background-color: #000
}

html.enhanced:not(.text-zoom,.no-heavy-media) .section-value-props {
    margin-top: -7vh;
    padding-top: 7vh
}

html.no-enhanced .section-value-props,html.no-heavy-media .section-value-props,html.no-js .section-value-props,html.text-zoom .section-value-props {
    overflow: hidden;
    padding-top: 7vh
}

.value-prop-list-container {
    position: relative;
    z-index: 1
}

@media screen and (min-width: 735px)and (max-width:794px) {
    .value-prop-list-container {
        width:635px
    }
}

.value-prop-list {
    margin-left: 0;
    list-style-type: none
}

@media only screen and (max-width: 734px) {
    .value-prop-list {
        padding-right:10px
    }
}

html.enhanced:not(.text-zoom,.no-heavy-media) .value-prop-list {
    padding-bottom: 90vh
}

html.edit-mode-highlight-on .value-prop-list {
    pointer-events: auto
}

@media only screen and (max-width: 1068px) {
    .value-prop-list {
        margin-right:12px
    }
}

@media screen and (min-width: 735px)and (max-width:760px) {
    .value-prop-list {
        margin-right:23px
    }
}

html.mq-medium-shorter .value-prop-list {
    margin-right: 23px
}

.value-prop {
    font-size: 56px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 0em;
    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    display: inline;
    color: #fff;
    --default-opacity: 0.15
}

.value-prop:lang(zh) {
    font-weight: 600
}

.value-prop:lang(ar) {
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.value-prop:lang(ja) {
    font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.value-prop:lang(ko) {
    font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.value-prop:lang(th) {
    font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.value-prop:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.value-prop:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.value-prop:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.value-prop:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

@media only screen and (max-width: 1068px) {
    .value-prop {
        font-size:44px;
        line-height: 1;
        font-weight: 700;
        letter-spacing: 0em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .value-prop:lang(zh) {
        font-weight: 600
    }

    .value-prop:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .value-prop:lang(ja) {
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .value-prop:lang(ko) {
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .value-prop:lang(th) {
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .value-prop:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .value-prop:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .value-prop:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .value-prop:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

@media only screen and (max-width: 734px) {
    .value-prop {
        font-size:27px;
        line-height: 1;
        font-weight: 700;
        letter-spacing: 0em;
        font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .value-prop:lang(zh) {
        font-weight: 600
    }

    .value-prop:lang(ar) {
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .value-prop:lang(ja) {
        font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .value-prop:lang(ko) {
        font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .value-prop:lang(th) {
        font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .value-prop:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .value-prop:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .value-prop:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .value-prop:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

html.enhanced:not(.text-zoom,.no-heavy-media) .value-prop:not(:first-child) {
    opacity: var(--default-opacity)
}

.scroll-container-value-props {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0
}

html.no-enhanced .scroll-container-value-props,html.no-heavy-media .scroll-container-value-props,html.no-js .scroll-container-value-props,html.text-zoom .scroll-container-value-props {
    position: relative;
    margin-top: 132px
}

.sticky-value-props {
    width: 100%;
    overflow: hidden
}

html.enhanced:not(.text-zoom,.no-heavy-media) .sticky-value-props {
    height: calc(100vh - var(--r-localnav-height));
    position: sticky;
    top: var(--r-localnav-height);
    margin-top: -100vh;
    opacity: 0
}

@media only screen and (max-width: 734px) {
    html.enhanced.ac-gn-segmentbar-visible:not(.text-zoom,.no-heavy-media) .sticky-value-props,html.enhanced.ac-ls-visible:not(.text-zoom,.no-heavy-media) .sticky-value-props {
        margin-top:-120vh
    }
}

.value-props-video-container {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden
}

.value-props-video {
    position: absolute;
    top: 0;
    left: 0
}

html.no-heavy-media .value-props-video,html.no-js .value-props-video {
    display: none
}

.value-props-picture {
    position: relative;
    width: 100%;
    height: 100%
}

html.no-enhanced .value-props-picture,html.no-heavy-media .value-props-picture,html.no-js .value-props-picture,html.text-zoom .value-props-picture {
    display: block;
    position: relative;
    max-width: 1440px;
    max-width: 100%!important
}

html.no-enhanced .value-props-picture::after,html.no-heavy-media .value-props-picture::after,html.no-js .value-props-picture::after,html.text-zoom .value-props-picture::after {
    content: "";
    display: block
}

html.no-enhanced .value-props-picture img,html.no-heavy-media .value-props-picture img,html.no-js .value-props-picture img,html.text-zoom .value-props-picture img {
    max-width: 100%;
    position: absolute
}

html.no-enhanced .value-props-picture::after,html.no-heavy-media .value-props-picture::after,html.no-js .value-props-picture::after,html.text-zoom .value-props-picture::after {
    padding-bottom: 56.25%
}

@media only screen and (max-width: 1068px) {
    html.no-enhanced .value-props-picture,html.no-heavy-media .value-props-picture,html.no-js .value-props-picture,html.text-zoom .value-props-picture {
        max-width:1068px
    }

    html.no-enhanced .value-props-picture::after,html.no-heavy-media .value-props-picture::after,html.no-js .value-props-picture::after,html.text-zoom .value-props-picture::after {
        padding-bottom: 56.1797752809%
    }
}

@media only screen and (max-width: 734px) {
    html.no-enhanced .value-props-picture,html.no-heavy-media .value-props-picture,html.no-js .value-props-picture,html.text-zoom .value-props-picture {
        max-width:734px
    }

    html.no-enhanced .value-props-picture::after,html.no-heavy-media .value-props-picture::after,html.no-js .value-props-picture::after,html.text-zoom .value-props-picture::after {
        padding-bottom: 56.1307901907%
    }
}

html.heavy-media .value-props-picture-static,html.no-heavy-media .value-props-picture-start {
    display: none
}

.value-props-picture noscript {
    width: 100%
}

.value-props-picture img,.value-props-video {
    width: 100%;
    height: 100%;
    object-fit: cover
}

html.reduced-motion .value-props-video-campaign {
    width: calc(100% + 2px);
    height: calc(100% + 2px)
}

.play-pause-button-value-props {
    position: absolute;
    z-index: 3;
    pointer-events: auto
}

.near-section .value-prop {
    will-change: transform,opacity
}

.section-audio-performance {
    padding-top: 170px;
    position: relative;
    pointer-events: none
}

@media only screen and (max-width: 1068px) {
    .section-audio-performance {
        padding-top:154px
    }
}

@media only screen and (max-width: 734px) {
    .section-audio-performance {
        padding-top:138px
    }
}

.section-audio-performance .bento-container,.section-audio-performance .section-content,.section-audio-performance .xray {
    pointer-events: auto
}

html.enhanced:not(.text-zoom,.no-heavy-media) .section-audio-performance {
    margin-top: -40vh
}

@media only screen and (min-width: 1069px) {
    html.text-zoom .section-audio-performance .headline-section {
        font-size:100px
    }
}

@media only screen and (min-width: 735px)and (max-width:1068px) {
    html.text-zoom .section-audio-performance .headline-section {
        font-size:70px
    }
}

@media only screen and (max-width: 734px) {
    html.text-zoom .section-audio-performance .headline-section {
        font-size:40px
    }
}

.bento-cell-h2-chip {
    padding-top: 3vh;
    padding-bottom: 3vh
}

@media only screen and (max-width: 734px) {
    .bento-cell-h2-chip {
        padding-top:38px;
        padding-bottom: 38px
    }
}

.h2-chip-container {
    width: 532px;
    height: 532px;
    position: relative;
    flex-shrink: 0
}

@media only screen and (max-width: 1068px) {
    .h2-chip-container {
        width:300px
    }
}

@media only screen and (max-width: 734px) {
    .h2-chip-container {
        width:280px
    }
}

@media only screen and (max-width: 1068px) {
    .h2-chip-container {
        height:300px
    }
}

@media only screen and (max-width: 734px) {
    .h2-chip-container {
        height:280px
    }
}

.h2-chip-endframe,.h2-chip-startframe,.h2-chip-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.h2-chip-video {
    opacity: 0
}

.loaded .h2-chip-video {
    opacity: 1
}

html.no-autoplay .h2-chip-startframe,html.no-autoplay .h2-chip-video,html.no-enhanced .h2-chip-startframe,html.no-enhanced .h2-chip-video,html.no-heavy-media .h2-chip-startframe,html.no-heavy-media .h2-chip-video {
    display: none
}

.xray {
    position: relative
}

@media only screen and (min-width: 1069px)and (max-height:700px) {
    .xray {
        padding-top:15vh
    }
}

@media only screen and (min-width: 735px)and (max-width:1068px)and (max-height:575px) {
    .xray {
        padding-top:15vh
    }
}

html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-scroll-container {
    height: 300vh
}

.xray-sticky {
    width: 100%;
    position: relative;
    overflow: hidden
}

html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-sticky {
    --scrim-opacity: 0;
    position: sticky;
    height: calc(100vh - var(--r-localnav-height));
    top: var(--r-localnav-height)
}

html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-sticky:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: var(--scrim-opacity);
    pointer-events: none;
    z-index: 1
}

@media only screen and (max-width: 734px) {
    html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-sticky {
        align-items:flex-start
    }
}

html.text-zoom .xray-sticky {
    overflow: hidden
}

.xray-airpod-particles-lockup {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 0;
    left: 0
}

html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-airpod-particles-lockup {
    position: absolute;
    width: 100%;
    height: 100%
}

@media only screen and (max-width: 734px)and (max-height:800px) {
    html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-airpod-1,html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-airpod-2,html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-airpod-particles-lockup {
        top:4vh
    }
}

@media only screen and (max-width: 734px)and (max-height:700px) {
    html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-airpod-1,html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-airpod-2,html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-airpod-particles-lockup {
        top:6vh
    }
}

@media only screen and (max-width: 734px)and (max-height:650px) {
    html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-airpod-1,html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-airpod-2,html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-airpod-particles-lockup {
        top:12vh
    }
}

.xray-particles-container,.xray-particles-pic {
    display: flex;
    justify-content: center;
    align-items: center
}

html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-particles-container {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0;
    transition: opacity 500ms,transform 300ms ease-out;
    transform: scale(1.2)
}

html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-particles-container.show {
    opacity: 1;
    transform: scale(1)
}

html.enhanced.heavy-media.no-mq-small-shorter:not(.text-zoom) .xray-particles-pic,html.mq-small-shorter .xray-particles-video,html.no-enhanced .xray-particles-video,html.no-heavy-media .xray-particles-video,html.no-js .xray-particles-video,html.text-zoom .xray-particles-video {
    display: none
}

.xray-particles-pic,.xray-particles-video {
    width: 1440px;
    height: 1050px;
    position: relative
}

@media only screen and (max-width: 1068px) {
    .xray-particles-pic,.xray-particles-video {
        width:1068px;
        height: 810px
    }
}

@media only screen and (max-width: 734px) {
    .xray-particles-pic,.xray-particles-video {
        width:734px;
        height: 734px;
        top: -17px
    }
}

html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-lockup-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: grid
}

.xray-lockup {
    display: grid;
    grid-template-columns: repeat(12,1fr)
}

html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-lockup {
    grid-area: 1/1/2/2;
    align-items: center;
    height: 100%
}

@media only screen and (max-width: 734px) {
    html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-lockup {
        grid-template-columns:100%;
        margin-top: 6vh
    }
}

html.mq-small-shorter .xray-lockup,html.no-enhanced .xray-lockup,html.no-js .xray-lockup,html.text-zoom .xray-lockup {
    position: relative;
    grid-template-rows: min-content
}

@media only screen and (max-width: 734px) {
    html.mq-small-shorter .xray-lockup,html.no-enhanced .xray-lockup,html.no-js .xray-lockup,html.text-zoom .xray-lockup {
        display:flex;
        flex-direction: column;
        align-items: center
    }
}

html.mq-small-shorter .xray-lockup:first-child,html.no-enhanced .xray-lockup:first-child,html.no-js .xray-lockup:first-child,html.text-zoom .xray-lockup:first-child {
    min-height: 522px;
    margin-top: 192px
}

@media only screen and (max-width: 1068px) {
    html.mq-small-shorter .xray-lockup:first-child,html.no-enhanced .xray-lockup:first-child,html.no-js .xray-lockup:first-child,html.text-zoom .xray-lockup:first-child {
        min-height:410px
    }
}

@media only screen and (max-width: 734px) {
    html.mq-small-shorter .xray-lockup:first-child,html.no-enhanced .xray-lockup:first-child,html.no-js .xray-lockup:first-child,html.text-zoom .xray-lockup:first-child {
        min-height:322px;
        margin-top: 6vh
    }
}

html.mq-small-shorter .xray-lockup:first-child .xray-copy,html.no-enhanced .xray-lockup:first-child .xray-copy,html.no-js .xray-lockup:first-child .xray-copy,html.text-zoom .xray-lockup:first-child .xray-copy {
    align-items: flex-start
}

@media only screen and (min-width: 1069px) {
    html.mq-small-shorter .xray-lockup:first-child .xray-copy:not(:first-child),html.no-enhanced .xray-lockup:first-child .xray-copy:not(:first-child),html.no-js .xray-lockup:first-child .xray-copy:not(:first-child),html.text-zoom .xray-lockup:first-child .xray-copy:not(:first-child) {
        margin-top:82px
    }
}

@media only screen and (min-width: 735px)and (max-width:1068px) {
    html.mq-small-shorter .xray-lockup:first-child .xray-copy:not(:first-child),html.no-enhanced .xray-lockup:first-child .xray-copy:not(:first-child),html.no-js .xray-lockup:first-child .xray-copy:not(:first-child),html.text-zoom .xray-lockup:first-child .xray-copy:not(:first-child) {
        margin-top:60px
    }
}

html.mq-small-shorter .xray-lockup:nth-child(2),html.no-enhanced .xray-lockup:nth-child(2),html.no-js .xray-lockup:nth-child(2),html.text-zoom .xray-lockup:nth-child(2) {
    min-height: 522px;
    margin-top: 185px;
    margin-bottom: 172px;
    grid-template-rows: 1fr
}

@media only screen and (max-width: 1068px) {
    html.mq-small-shorter .xray-lockup:nth-child(2),html.no-enhanced .xray-lockup:nth-child(2),html.no-js .xray-lockup:nth-child(2),html.text-zoom .xray-lockup:nth-child(2) {
        min-height:410px
    }
}

@media only screen and (max-width: 734px) {
    html.mq-small-shorter .xray-lockup:nth-child(2),html.no-enhanced .xray-lockup:nth-child(2),html.no-js .xray-lockup:nth-child(2),html.text-zoom .xray-lockup:nth-child(2) {
        min-height:322px;
        margin-top: 130px
    }
}

.xray-copy {
    display: flex;
    align-items: center;
    grid-column: 1/span 4;
    position: relative;
    z-index: 1
}

@media only screen and (min-width: 1069px) {
    .xray-copy.guts-1,.xray-copy.guts-2 {
        padding-right:8%
    }
}

@media only screen and (min-width: 735px)and (max-width:1068px) {
    .xray-copy.guts-1,.xray-copy.guts-2 {
        padding-right:12%
    }
}

.xray-copy.guts-3 {
    grid-column-start: 9
}

@media only screen and (min-width: 1069px) {
    .xray-copy.guts-3 {
        padding-left:8%
    }
}

@media only screen and (min-width: 735px)and (max-width:1068px) {
    .xray-copy.guts-3 {
        padding-left:12%
    }
}

html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-copy {
    grid-row: 1/span 1;
    opacity: 0
}

@media only screen and (max-width: 734px) {
    html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-copy.xray-copy {
        grid-column:1/span 1;
        align-self: start
    }
}

@media only screen and (max-width: 734px) {
    html.mq-small-shorter .xray-copy,html.no-enhanced .xray-copy,html.no-js .xray-copy,html.text-zoom .xray-copy {
        margin-bottom:46px
    }
}

@media only screen and (min-width: 735px)and (max-width:1068px) {
    html.text-zoom .xray-copy.guts-3 {
        padding-left:0;
        margin-left: -20px
    }
}

.xray-airpod {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 522px
}

@media only screen and (max-width: 1068px) {
    .xray-airpod {
        min-height:410px
    }
}

@media only screen and (max-width: 734px) {
    .xray-airpod {
        min-height:322px;
        grid-column: 1/span 1;
        grid-row: 1/span 1;
        justify-self: center
    }
}

html.mq-small-shorter .xray-airpod:not(.xray-airpod-3),html.no-enhanced .xray-airpod:not(.xray-airpod-3),html.no-js .xray-airpod:not(.xray-airpod-3),html.text-zoom .xray-airpod:not(.xray-airpod-3) {
    align-items: flex-start
}

html.mq-small-shorter .xray-airpod+noscript,html.no-enhanced .xray-airpod+noscript,html.no-js .xray-airpod+noscript,html.text-zoom .xray-airpod+noscript {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center
}

html.mq-small-shorter .xray-airpod+noscript .xray-airpod,html.no-enhanced .xray-airpod+noscript .xray-airpod,html.no-js .xray-airpod+noscript .xray-airpod,html.text-zoom .xray-airpod+noscript .xray-airpod {
    position: static
}

@media only screen and (max-width: 734px) {
    html.mq-small-shorter .xray-airpod:not(.xray-airpod-3),html.mq-small-shorter .xray-airpod:not(.xray-airpod-3)+noscript,html.no-enhanced .xray-airpod:not(.xray-airpod-3),html.no-enhanced .xray-airpod:not(.xray-airpod-3)+noscript,html.no-js .xray-airpod:not(.xray-airpod-3),html.no-js .xray-airpod:not(.xray-airpod-3)+noscript,html.text-zoom .xray-airpod:not(.xray-airpod-3),html.text-zoom .xray-airpod:not(.xray-airpod-3)+noscript {
        position:static
    }
}

html.enhanced.no-mq-small-shorter:not(.text-zoom) .xray-airpod:not(.xray-airpod-1) img {
    opacity: 0
}

.xray-airpod img {
    display: block
}

@media only screen and (max-width: 734px) {
    .xray-airpod img {
        transform-origin:50% 20%
    }
}

.xray-airpod-1 img {
    width: 368px;
    height: 522px;
    position: relative
}

@media only screen and (max-width: 1068px) {
    .xray-airpod-1 img {
        width:289px;
        height: 410px
    }
}

@media only screen and (max-width: 734px) {
    .xray-airpod-1 img {
        width:227px;
        height: 322px
    }
}

@media only screen and (min-width: 1069px) {
    .xray-airpod-1 img {
        left:7px
    }
}

@media only screen and (min-width: 735px)and (max-width:1068px) {
    .xray-airpod-1 img {
        left:6px
    }
}

.xray-airpod-2 img,.xray-airpod-3 img {
    width: 368px;
    height: 522px;
    mask-image: url(../../images/overview/audio_airpod_mask__c3ed1snibvo2_large.png);
    mask-size: 368px 522px;
    mask-repeat: no-repeat;
    position: relative;
    left: -34px
}

@media only screen and (max-width: 1068px) {
    .xray-airpod-2 img,.xray-airpod-3 img {
        width:289px;
        height: 410px
    }
}

@media only screen and (max-width: 734px) {
    .xray-airpod-2 img,.xray-airpod-3 img {
        width:227px;
        height: 322px
    }
}

@media (min-resolution: 144dpi),only screen and (min-resolution:1.5dppx) {
    .xray-airpod-2 img,.xray-airpod-3 img {
        mask-image:url(../../images/overview/audio_airpod_mask__c3ed1snibvo2_large_2x.png)
    }
}

@media only screen and (max-width: 1068px) {
    .xray-airpod-2 img,.xray-airpod-3 img {
        mask-image:url(../../images/overview/audio_airpod_mask__c3ed1snibvo2_medium.png);
        mask-size: 289px 410px;
        mask-repeat: no-repeat
    }
}

@media only screen and (max-width: 1068px)and (min-resolution:1.5dppx),only screen and (max-width:1068px)and (min-resolution:144dpi) {
    .xray-airpod-2 img,.xray-airpod-3 img {
        mask-image:url(../../images/overview/audio_airpod_mask__c3ed1snibvo2_medium_2x.png)
    }
}

@media only screen and (max-width: 734px) {
    .xray-airpod-2 img,.xray-airpod-3 img {
        mask-image:url(../../images/overview/audio_airpod_mask__c3ed1snibvo2_small.png);
        mask-size: 227px 322px;
        mask-repeat: no-repeat
    }
}

@media only screen and (max-width: 734px)and (min-resolution:1.5dppx),only screen and (max-width:734px)and (min-resolution:144dpi) {
    .xray-airpod-2 img,.xray-airpod-3 img {
        mask-image:url(../../images/overview/audio_airpod_mask__c3ed1snibvo2_small_2x.png)
    }
}

@media only screen and (max-width: 1068px) {
    .xray-airpod-2 img,.xray-airpod-3 img {
        left:-26px
    }
}

@media only screen and (max-width: 734px) {
    .xray-airpod-2 img,.xray-airpod-3 img {
        left:-23px
    }
}

.play-pause-button-xray {
    display: none;
    position: absolute;
    transition: opacity 300ms;
    opacity: 0;
    z-index: 1;
    pointer-events: none
}

.play-pause-button-xray.show:not(:disabled) {
    opacity: 1;
    pointer-events: auto
}

.play-pause-button-xray.show:not(:disabled):hover {
    color: rgba(255,255,255,.8)
}

html.enhanced.no-mq-small-shorter:not(.text-zoom) .play-pause-button-xray {
    display: block
}

html.enhanced.no-mq-small-shorter:not(.text-zoom) .near-section .play-pause-button-xray,html.enhanced.no-mq-small-shorter:not(.text-zoom) .near-section .xray-airpod img,html.enhanced.no-mq-small-shorter:not(.text-zoom) .near-section .xray-copy,html.enhanced.no-mq-small-shorter:not(.text-zoom) .near-section .xray-particles-video,html.enhanced.no-mq-small-shorter:not(.text-zoom) .near-section .xray-sticky:after {
    will-change: transform,opacity
}

.section-noise-cancellation {
    padding-top: 170px;
    position: relative;
    pointer-events: none
}

@media only screen and (max-width: 1068px) {
    .section-noise-cancellation {
        padding-top:154px
    }
}

@media only screen and (max-width: 734px) {
    .section-noise-cancellation {
        padding-top:138px
    }
}

html.enhanced.no-mq-small-shorter:not(.text-zoom) .section-noise-cancellation {
    margin-top: -75vh
}

.section-noise-cancellation .bento-container,.section-noise-cancellation .section-content {
    pointer-events: auto
}

@media only screen and (max-width: 734px) {
    .section-noise-cancellation .intro-copy {
        padding-right:10px
    }
}

.bento-noise-cancellation {
    grid-template-rows: min-content 1fr
}

.noise-cancellation-icon {
    margin-bottom: 24px
}

@media only screen and (min-width: 735px)and (max-width:1068px) {
    .noise-cancellation-icon {
        margin-bottom:12px
    }
}

@media only screen and (min-width: 1069px) {
    .bento-noise-cancellation-anc {
        padding-top:84px;
        padding-bottom: 84px
    }
}

@media only screen and (min-width: 735px)and (max-width:1068px) {
    .bento-cell-microphones,.bento-noise-cancellation-anc {
        padding-top:64px;
        padding-bottom: 64px
    }
}

.bento-cell-microphones {
    grid-column-start: 2;
    grid-row: 1/span 2;
    display: block;
    overflow: hidden;
    padding-bottom: 0
}

@media only screen and (min-width: 735px) {
    .bento-cell-microphones .bento-cell-copy {
        margin-left:0
    }
}

.bento-cell-microphones .copy {
    position: relative;
    z-index: 1
}

.bento-cell-microphones .pin-overflow-container {
    position: absolute;
    right: -25px;
    top: 0;
    overflow: hidden;
    width: 9px;
    display: flex;
    justify-content: center;
    height: 372px
}

@media only screen and (max-width: 1068px) {
    .bento-cell-microphones .pin-overflow-container {
        right:-23px;
        bottom: -180px;
        height: 345px
    }
}

@media only screen and (max-width: 734px) {
    .bento-cell-microphones .pin-overflow-container {
        top:calc(100% + 15px);
        right: auto;
        left: 224px;
        bottom: -190px;
        height: 185px
    }
}

html.text-zoom .bento-cell-microphones .pin-overflow-container {
    display: none
}

.bento-cell-microphones .pin {
    position: absolute;
    bottom: 13px
}

.anc-airpods-microphones-pic {
    height: 791px;
    float: right;
    margin-bottom: -126px;
    margin-top: 68px;
    position: relative;
    left: -330px
}

@media only screen and (max-width: 1068px) {
    .anc-airpods-microphones-pic {
        height:513px
    }
}

@media only screen and (max-width: 734px) {
    .anc-airpods-microphones-pic {
        height:509px
    }
}

@media only screen and (max-width: 1068px) {
    .anc-airpods-microphones-pic {
        margin-bottom:-60px;
        left: -210px
    }
}

@media only screen and (max-width: 734px) {
    .anc-airpods-microphones-pic {
        left:-100%;
        margin-top: 68px
    }
}

.anc-airpods-microphones-pic img {
    position: absolute;
    top: 0;
    left: 0
}

.stat-copy-anc {
    padding-left: 10px;
    line-height: .98
}

@media only screen and (max-width: 1068px) {
    .stat-copy-anc {
        line-height:1.06
    }
}

@media only screen and (max-width: 734px) {
    .stat-copy-anc {
        line-height:.95
    }
}

.factoid-anc-bg {
    position: absolute;
    top: 0;
    left: 0
}

.ear-tips-exploded {
    display: flex;
    justify-content: center;
    margin-top: 80px
}

@media only screen and (max-width: 1068px) {
    .ear-tips-exploded {
        margin-top:140px
    }
}

@media only screen and (max-width: 734px) {
    .ear-tips-exploded {
        position:relative;
        height: 320px;
        margin-top: 72px
    }
}

.ear-tips-exploded-content {
    display: flex;
    flex-direction: row-reverse
}

@media only screen and (max-width: 734px) {
    .ear-tips-exploded-content {
        position:absolute;
        top: 0;
        left: 0;
        grid-column-gap: 30px;
        column-gap: 30px;
        margin-left: auto;
        margin-right: auto
    }

    html.no-enhanced .ear-tips-exploded-content {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr 1fr
    }
}

.ear-tips-exploded-bud {
    flex-shrink: 0;
    padding-left: 56px
}

@media only screen and (max-width: 1068px) {
    .ear-tips-exploded-bud {
        padding-left:48px
    }
}

@media only screen and (max-width: 734px) {
    .ear-tips-exploded-bud {
        padding-left:10px
    }

    html.no-enhanced .ear-tips-exploded-bud {
        grid-column-start: 3;
        grid-row: 1/span 2
    }
}

.ear-tips-exploded-tip {
    flex-shrink: 0;
    position: relative
}

@media only screen and (max-width: 734px) {
    .ear-tips-exploded-tip {
        display:flex;
        justify-content: center
    }
}

.ear-tips-exploded-tip:not(:last-child) {
    padding-left: 46px
}

@media only screen and (max-width: 1068px) {
    .ear-tips-exploded-tip:not(:last-child) {
        padding-left:32px
    }
}

@media only screen and (max-width: 734px) {
    .ear-tips-exploded-tip:not(:last-child) {
        padding-left:0
    }
}

.ear-tips-exploded-tip.large {
    padding-top: 2%
}

@media only screen and (max-width: 734px) {
    html.no-enhanced .ear-tips-exploded-tip.large {
        padding-top:20px;
        grid-column-start: 2;
        grid-row-start: 2
    }
}

.ear-tips-exploded-tip.medium {
    padding-top: 3.5%
}

@media only screen and (max-width: 734px) {
    html.no-enhanced .ear-tips-exploded-tip.medium {
        padding-top:20px;
        grid-column-start: 1;
        grid-row-start: 2
    }
}

.ear-tips-exploded-tip.small {
    padding-top: 4.4%
}

@media only screen and (max-width: 734px) {
    html.no-enhanced .ear-tips-exploded-tip.small {
        padding-top:20px;
        grid-column-start: 2;
        grid-row-start: 1
    }
}

.ear-tips-exploded-tip.xsmall {
    padding-top: 4.6%
}

@media only screen and (max-width: 734px) {
    html.no-enhanced .ear-tips-exploded-tip.xsmall {
        padding-top:20px;
        grid-column-start: 1;
        grid-row-start: 1
    }
}

.near-section .ear-tips-exploded-label,.near-section .ear-tips-exploded-tip-pic {
    will-change: transform,opacity
}

.ear-tips-exploded-label {
    font-size: 20px;
    line-height: 1.2;
    font-weight: 600;
    letter-spacing: 0em;
    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    position: absolute;
    top: 60%;
    padding-left: 6px
}

.ear-tips-exploded-label:lang(ar) {
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ear-tips-exploded-label:lang(ja) {
    font-family: SF Pro JP,SF Pro Display,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ear-tips-exploded-label:lang(ko) {
    font-family: SF Pro KR,SF Pro Display,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ear-tips-exploded-label:lang(th) {
    font-family: SF Pro TH,SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ear-tips-exploded-label:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Display,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ear-tips-exploded-label:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ear-tips-exploded-label:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Display,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ear-tips-exploded-label:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Display,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

@media only screen and (max-width: 1068px) {
    .ear-tips-exploded-label {
        font-size:14px;
        line-height: 1.4285914286;
        font-weight: 600;
        letter-spacing: -0.016em;
        font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .ear-tips-exploded-label:lang(ar) {
        letter-spacing: 0em;
        font-family: SF Pro AR,SF Pro Gulf,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .ear-tips-exploded-label:lang(ja) {
        letter-spacing: 0em;
        font-family: SF Pro JP,SF Pro Text,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .ear-tips-exploded-label:lang(ko) {
        line-height: 1.5714285714;
        letter-spacing: 0em;
        font-family: SF Pro KR,SF Pro Text,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .ear-tips-exploded-label:lang(zh) {
        line-height: 1.5;
        letter-spacing: 0em
    }

    .ear-tips-exploded-label:lang(th) {
        line-height: 1.3571828571;
        letter-spacing: 0em;
        font-family: SF Pro TH,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .ear-tips-exploded-label:lang(zh-CN) {
        font-family: SF Pro SC,SF Pro Text,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .ear-tips-exploded-label:lang(zh-HK) {
        font-family: SF Pro HK,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .ear-tips-exploded-label:lang(zh-MO) {
        font-family: SF Pro HK,SF Pro TC,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
    }

    .ear-tips-exploded-label:lang(zh-TW) {
        font-family: SF Pro TC,SF Pro Text,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
    }
}

@media only screen and (max-width: 734px) {
    html.no-enhanced .ear-tips-exploded-label,html.no-js .ear-tips-exploded-label {
        top:auto;
        left: 6px
    }

    html.no-enhanced .ear-tips-exploded-tip.large .ear-tips-exploded-label,html.no-enhanced .ear-tips-exploded-tip.medium .ear-tips-exploded-label,html.no-js .ear-tips-exploded-tip.large .ear-tips-exploded-label,html.no-js .ear-tips-exploded-tip.medium .ear-tips-exploded-label {
        bottom: -21px
    }

    html.no-enhanced .ear-tips-exploded-tip.small .ear-tips-exploded-label,html.no-enhanced .ear-tips-exploded-tip.xsmall .ear-tips-exploded-label,html.no-js .ear-tips-exploded-tip.small .ear-tips-exploded-label,html.no-js .ear-tips-exploded-tip.xsmall .ear-tips-exploded-label {
        bottom: 10px
    }
}

.factoid-noise-monitor {
    position: relative;
    z-index: 1
}

.factoid-noise-monitor .stat-number {
    padding-top: .05em;
    padding-bottom: .05em
}

.noise-monitor-pic {
    display: flex;
    align-items: center
}

.noise-monitor-pic img {
    height: auto;
    object-fit: fill
}

.bento-cell-hearing-health.bento-cell {
    padding: 0px 19vw;
}

@media only screen and (max-width: 1068px) {
    .bento-cell-hearing-health.bento-cell {
        padding:0 52px
    }
}

@media only screen and (max-width: 734px) {
    .bento-cell-hearing-health.bento-cell {
        padding:62px 6.25% 0;
        flex-direction: column
    }
}

.bento-cell-hearing-health.bento-cell sup a {
    color: #6e6e73
}

.bento-cell-hearing-health.bento-cell a {
    color: #fff
}

.bento-cell-hearing-health.bento-cell .image-container {
    display: flex;
    position: relative
}

.bento-cell-hearing-health.bento-cell .hearing-health {
    margin-top: 20px;
    align-self: flex-end;
    position: relative;
    left: 50%;
    margin-left: -201px
}

@media only screen and (max-width: 1068px) {
    .bento-cell-hearing-health.bento-cell .hearing-health {
        left:50%;
        margin-left: -126.5px
    }
}

@media only screen and (max-width: 734px) {
    .bento-cell-hearing-health.bento-cell .hearing-health {
        left:50%;
        margin-left: -123px
    }
}

@media only screen and (max-width: 1068px) {
    .bento-cell-hearing-health.bento-cell .hearing-health {
        margin-top:68px
    }
}

@media only screen and (max-width: 734px) {
    .bento-cell-hearing-health.bento-cell .hearing-health {
        margin-top:64px
    }
}

.bento-cell-hearing-health.bento-cell .hearing-health img {
    display: block
}

.bento-cell-hearing-health.bento-cell.hearing-avail .bento-cell-copy {
    padding-bottom: 110px;
    padding-top: 64px
}

@media only screen and (max-width: 1068px) {
    .bento-cell-hearing-health.bento-cell.hearing-avail .bento-cell-copy {
        padding-bottom:140px
    }
}

@media only screen and (max-width: 734px) {
    .bento-cell-hearing-health.bento-cell.hearing-avail .bento-cell-copy {
        padding-top:0;
        padding-bottom: 0
    }
}

.bento-cell-hearing-health.bento-cell.hearing-avail .image-container {
    height: 100%
}

.bento-cell-hearing-health.bento-cell .hearing-avail-subcopy {
    bottom: 60px;
    color: #86868b
}

@media only screen and (min-width: 735px) {
    .bento-cell-hearing-health.bento-cell .hearing-avail-subcopy {
        position:absolute
    }
}

@media only screen and (max-width: 1068px) {
    .bento-cell-hearing-health.bento-cell .hearing-avail-subcopy {
        bottom:50px
    }
}

@media only screen and (max-width: 734px) {
    .bento-cell-hearing-health.bento-cell .hearing-avail-subcopy {
        position:static;
        margin-top: 24px
    }
}

.bento-cell-hearing-health.bento-cell .hearing-avail-subcopy>span {
    display: inline-block
}

.bento-cell-hearing-health.bento-cell .hearing-avail-subcopy a {
    pointer-events: auto;
    color: inherit
}

.bento-cell-hearing-health.bento-cell.hearing-avail-2 .bento-cell-copy {
    padding-top: 64px;
    padding-bottom: 60px
}

@media only screen and (max-width: 1068px) {
    .bento-cell-hearing-health.bento-cell.hearing-avail-2 .bento-cell-copy {
        padding-bottom:44px
    }
}

@media only screen and (max-width: 734px) {
    .bento-cell-hearing-health.bento-cell.hearing-avail-2 .bento-cell-copy {
        padding-top:0;
        padding-bottom: 0
    }
}

.bento-cell-hearing-health.bento-cell.hearing-avail-2 .image-container {
    height: 100%
}

.bento-cell-hearing-health.bento-cell.hearing-avail-2 .hearing-avail-subcopy {
    position: static;
    margin-top: 80px
}

@media only screen and (max-width: 1068px) {
    .bento-cell-hearing-health.bento-cell.hearing-avail-2 .hearing-avail-subcopy {
        margin-top:45px;
        margin-top: 54px
    }
}

.bento-cell-voice {
    grid-column-start: 1;
    grid-row: 1/span 2;
    overflow: hidden;
    padding-bottom: 0;
    padding-top: 0;
    display: flex;
    align-items: center;
    min-height: 640px
}

@media only screen and (max-width: 734px) {
    .bento-cell-voice {
        min-height:400px
    }
}

.bento-cell-voice .bento-cell-copy {
    margin-top: 28px
}

@media only screen and (max-width: 1068px) {
    .bento-cell-voice .bento-cell-copy {
        margin-top:0
    }
}

.bento-cell-conversation .bento-cell-copy {
    transform: translateY(-3px)
}

@media only screen and (max-width: 1068px) {
    .bento-cell-conversation .bento-cell-copy {
        transform:translateY(-6px)
    }
}

@media only screen and (max-width: 734px) {
    .bento-cell-conversation .bento-cell-copy {
        transform:none
    }
}

.bento-cell-gestures {
    flex-direction: column;
    justify-content: flex-start
}

.gestures-container {
    position: relative;
    height: 204px;
    width: 100%;
    margin-bottom: 102px
}

@media only screen and (max-width: 1068px) {
    .gestures-container {
        height:124px
    }
}

@media only screen and (max-width: 734px) {
    .gestures-container {
        height:162px
    }
}

.video-container {
    width: 100%;
    height: 100%
}

.gestures-endframe,.gestures-startframe,.gestures-video {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: auto;
    height: 100%;
    background: #000
}

.gestures-video {
    width: auto
}

.gestures-endframe,.gestures-startframe {
    text-align: center
}

.gestures-endframe img,.gestures-startframe img {
    height: 100%
}

.loaded .video-container {
    opacity: 1;
    z-index: 2
}

.video-container.ended~.gestures-startframe {
    z-index: -1
}

.video-container.ended~.gestures-endframe {
    z-index: 1
}

.video-container.loading~.gestures-startframe {
    opacity: 1;
    z-index: 1
}

.video-container.playing~.gestures-startframe {
    z-index: -2
}

.video-container.playing~.gestures-endframe {
    z-index: -1
}

.gestures-video {
    height: 100%
}

html.no-js .gestures-video,html.reduced-motion .gestures-video {
    display: none
}

.bento-cell-touch-control {
    align-items: flex-start
}

.bento-cell-touch-control .bento-cell-copy {
    padding-top: 345px
}

@media only screen and (max-width: 1068px) {
    .bento-cell-touch-control .bento-cell-copy {
        padding-top: 340px;
    }
}

@media only screen and (max-width: 734px) {
    .bento-cell-touch-control .bento-cell-copy {
        padding-top:292px;
        margin-bottom: -15px
    }
}

.bento-cell-gestures .bento-headline,.bento-cell-touch-control .bento-headline {
    min-height: 104px
}

@media only screen and (max-width: 1068px) {
    .bento-cell-gestures .bento-headline,.bento-cell-touch-control .bento-headline {
        min-height:132px
    }
}

@media only screen and (max-width: 734px) {
    .bento-cell-gestures .bento-headline,.bento-cell-touch-control .bento-headline {
        min-height:unset
    }
}

.bento-cell-gestures.bento-cell,.bento-cell-touch-control.bento-cell {
    padding: 110px 6vw 103px
}

@media only screen and (max-width: 1068px) {
    .bento-cell-gestures.bento-cell,.bento-cell-touch-control.bento-cell {
        padding:77px 6.5vw 61px
    }
}

@media only screen and (max-width: 734px) {
    .bento-cell-gestures.bento-cell,.bento-cell-touch-control.bento-cell {
        padding:80px 6.5vw
    }
}

html.text-zoom .bento-cell-gestures .copy,html.text-zoom .bento-cell-touch-control .copy {
    width: 70%
}

@media only screen and (max-width: 1068px) {
    html.text-zoom .bento-cell-gestures .copy,html.text-zoom .bento-cell-touch-control .copy {
        width:50%
    }
}

@media only screen and (max-width: 734px) {
    html.text-zoom .bento-cell-gestures .copy,html.text-zoom .bento-cell-touch-control .copy {
        width:unset
    }
}

.touch-control-container {
    max-width: none
}

.touch-control-airpod-pic-container {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%)
}

.touch-control-swipe-container {
    --dot-size: 110px;
    position: absolute;
    top: 58px;
    left: 130px;
    width: var(--dot-size);
    height: 223px;
    transform: skewX(23.5deg) skewY(-11.5deg)
}

@media only screen and (max-width: 1068px) {
    .touch-control-swipe-container {
        --dot-size:62px;
        top: 39px;
        left: 83px;
        height: 139px
    }
}

@media only screen and (max-width: 734px) {
    .touch-control-swipe-container {
        --dot-size:72px;
        top: 78px;
        left: 108px;
        height: 168px
    }
}

.touch-control-swipe-dot {
    position: absolute;
    width: var(--dot-size);
    height: var(--dot-size);
    border-radius: 50%;
    background-color: #e17630;
    opacity: .5;
    top: 30%
}

html.enhanced .touch-control-swipe-dot {
    opacity: 0;
    bottom: 0;
    top: auto
}

.near-section .touch-control-swipe-dot {
    will-change: transform,opacity
}

.touch-control-headline-container {
    font-size: 4.95vw;
    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    font-weight: 700;
    line-height: 1.1
}

@media only screen and (min-width: 1460px) {
    .touch-control-headline-container {
        font-size:72px
    }
}

@media only screen and (max-width: 1068px) {
    .touch-control-headline-container {
        font-size:38px
    }
}

@media only screen and (max-width: 734px) {
    .touch-control-headline-container {
        font-size:40px
    }
}

.touch-control-headline {
    --touch-control-gap: 305px;
    position: absolute;
    top: 332px;
    left: 0;
    width: 100%
}

@media only screen and (max-width: 1068px) {
    .touch-control-headline {
        --touch-control-gap:215px;
        top: 231px
    }
}

@media only screen and (max-width: 734px) {
    .touch-control-headline {
        font-size:40px;
        text-align: left;
        position: static;
        margin-top: 54px
    }
}

@media only screen and (min-width: 735px) {
    .touch-control-headline.little {
        font-size:.9em
    }

    .touch-control-headline.littler {
        font-size: .8em
    }
}

.touch-control-start {
    position: absolute;
    right: calc(50% + var(--touch-control-gap)/2)
}

@media only screen and (max-width: 734px) {
    .touch-control-start {
        position:static
    }
}

.touch-control-end {
    position: absolute;
    left: calc(50% + var(--touch-control-gap)/2)
}

@media only screen and (max-width: 734px) {
    .touch-control-end {
        position:static
    }
}

html.text-zoom .touch-control-end,html.text-zoom .touch-control-headline,html.text-zoom .touch-control-start {
    margin-top: 80px;
    position: static
}

html.text-zoom .touch-control-copy {
    max-width: 100%
}

.touch-control-copy {
    margin-top: 62px
}

@media only screen and (max-width: 734px) {
    .touch-control-copy {
        margin-top:43px
    }
}

.wave-animation {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0
}

.wave {
    position: relative;
    top: .3em
}

.wave-overflow {
    overflow: hidden
}

.play-pause-button-wave {
    position: absolute;
    z-index: 1
}

.play-pause-button-wave.play .slot-play {
    display: none
}

.play-pause-button-wave.pause .slot-play,.play-pause-button-wave.play .slot-pause {
    display: block
}

.play-pause-button-wave.pause .slot-pause {
    display: none
}

.overview-airpod-tips {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 259px;
    --p-height: 423px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-airpod-tips {
        --p-width:172px;
        --p-height: 279px
    }
}

.overview-airpod-tips-l {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 120px;
    --p-height: 219px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-airpod-tips-l {
        --p-width:81px;
        --p-height: 145px
    }
}

.overview-airpod-tips-m {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 122px;
    --p-height: 193px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-airpod-tips-m {
        --p-width:81px;
        --p-height: 127px
    }
}

.overview-airpod-tips-s {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 122px;
    --p-height: 175px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-airpod-tips-s {
        --p-width:81px;
        --p-height: 115px
    }
}

.overview-airpod-tips-xs {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 107px;
    --p-height: 170px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-airpod-tips-xs {
        --p-width:71px;
        --p-height: 112px
    }
}

.overview-logo-conversation-boost {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 63px;
    --p-height: 63px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-logo-conversation-boost {
        --p-width:63px;
        --p-height: 63px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .overview-logo-conversation-boost {
        --p-width:54px;
        --p-height: 54px
    }
}

.overview-icon-person-wave {
    --p-width: 44px
}

.overview-icon-person-wave,.overview-icon-speaker-wave {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-height: 42px
}

.overview-icon-speaker-wave {
    --p-width: 43px
}

.overview-hearing-health-iphone {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 719px;
    --p-height: 402px;
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-hearing-health-iphone {
        --p-width:253px;
        --p-height: 457px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .overview-hearing-health-iphone {
        --p-width:246px;
        --p-height: 453px
    }
}

.section-personalized-listening {
    position: relative;
    padding-top: 170px
}

@media only screen and (max-width: 1068px) {
    .section-personalized-listening {
        padding-top:154px
    }
}

@media only screen and (max-width: 734px) {
    .section-personalized-listening {
        padding-top:138px;
        margin-bottom: -100vh
    }
}

html.android .section-personalized-listening,html.no-autoplay .section-personalized-listening,html.no-enhanced .section-personalized-listening,html.no-heavy-media .section-personalized-listening,html.no-js .section-personalized-listening {
    margin-bottom: 200px
}

@media only screen and (max-width: 1068px) {
    html.android .section-personalized-listening,html.no-autoplay .section-personalized-listening,html.no-enhanced .section-personalized-listening,html.no-heavy-media .section-personalized-listening,html.no-js .section-personalized-listening {
        margin-bottom:120px
    }
}

@media only screen and (max-width: 734px) {
    html.android .section-personalized-listening,html.no-autoplay .section-personalized-listening,html.no-enhanced .section-personalized-listening,html.no-heavy-media .section-personalized-listening,html.no-js .section-personalized-listening {
        margin-bottom:60px
    }
}

html.text-zoom .section-personalized-listening .headline-section {
    overflow-wrap: break-word
}

html.android .section-personalized-listening .fallback-image,html.no-autoplay .section-personalized-listening .fallback-image,html.no-enhanced .section-personalized-listening .fallback-image,html.no-heavy-media .section-personalized-listening .fallback-image,html.no-js .section-personalized-listening .fallback-image {
    display: block
}

.personalized-listening-section-content {
    margin-bottom: 90px
}

@media only screen and (max-width: 1068px) {
    .personalized-listening-section-content {
        margin-bottom:100px
    }
}

@media only screen and (max-width: 734px) {
    .personalized-listening-section-content {
        margin-bottom:200px
    }
}

html.android .personalized-listening-section-content,html.no-autoplay .personalized-listening-section-content,html.no-enhanced .personalized-listening-section-content,html.no-heavy-media .personalized-listening-section-content,html.no-js .personalized-listening-section-content {
    margin-bottom: 200px
}

@media only screen and (max-width: 1068px) {
    html.android .personalized-listening-section-content,html.no-autoplay .personalized-listening-section-content,html.no-enhanced .personalized-listening-section-content,html.no-heavy-media .personalized-listening-section-content,html.no-js .personalized-listening-section-content {
        margin-bottom:105px
    }
}

@media only screen and (max-width: 734px) {
    html.android .personalized-listening-section-content,html.no-autoplay .personalized-listening-section-content,html.no-enhanced .personalized-listening-section-content,html.no-heavy-media .personalized-listening-section-content,html.no-js .personalized-listening-section-content {
        margin-bottom:80px
    }
}

.intro-copy-personalized-listening {
    margin-bottom: 20px
}

.dancer-container {
    --sequence-start: a0t;
    --sequence-end: a0b - calc(100vh - var(--r-localnav-height));
    position: relative;
    height: 200vh
}

@media only screen and (max-width: 734px) {
    .dancer-container.dancer-scroll-container-small {
        --sequence-start:a1t - calc(100vh - var(--r-localnav-height));
        --sequence-end: a1b - calc(100vh - var(--r-localnav-height));
        height: calc(500vh - var(--r-localnav-height))
    }
}

html.android .dancer-container,html.no-autoplay .dancer-container,html.no-enhanced .dancer-container,html.no-heavy-media .dancer-container,html.no-js .dancer-container {
    position: relative;
    height: auto;
    margin-bottom: 200px
}

@media only screen and (max-width: 1068px) {
    html.android .dancer-container,html.no-autoplay .dancer-container,html.no-enhanced .dancer-container,html.no-heavy-media .dancer-container,html.no-js .dancer-container {
        margin-bottom:120px
    }
}

@media only screen and (max-width: 734px) {
    html.android .dancer-container,html.no-autoplay .dancer-container,html.no-enhanced .dancer-container,html.no-heavy-media .dancer-container,html.no-js .dancer-container {
        margin-bottom:80px
    }
}

@media only screen and (min-width: 735px) {
    .dancer-sticky-content {
        height:calc(100% + 100vh);
        position: relative
    }
}

@media only screen and (max-width: 734px) {
    .dancer-sticky-content-small {
        z-index:1;
        position: sticky;
        top: var(--r-localnav-height);
        height: calc(100vh - var(--r-localnav-height));
        pointer-events: auto
    }
}

html.android .dancer-sticky-content,html.no-autoplay .dancer-sticky-content,html.no-enhanced .dancer-sticky-content,html.no-heavy-media .dancer-sticky-content,html.no-js .dancer-sticky-content {
    position: static;
    height: auto
}

.dancer-lockup-container {
    position: absolute;
    width: 100%
}

@media only screen and (max-width: 734px) {
    .dancer-lockup-container {
        height:100%;
        display: grid;
        align-items: end;
        overflow: hidden
    }

    html.android .dancer-lockup-container,html.no-autoplay .dancer-lockup-container,html.no-enhanced .dancer-lockup-container,html.no-heavy-media .dancer-lockup-container,html.no-js .dancer-lockup-container {
        align-items: center
    }
}

html.android .dancer-lockup-container,html.no-autoplay .dancer-lockup-container,html.no-enhanced .dancer-lockup-container,html.no-heavy-media .dancer-lockup-container,html.no-js .dancer-lockup-container {
    position: static;
    display: block
}

.dancer-lockup {
    display: grid
}

@media only screen and (max-width: 734px) {
    html.android .dancer-lockup,html.no-autoplay .dancer-lockup,html.no-enhanced .dancer-lockup,html.no-heavy-media .dancer-lockup,html.no-js .dancer-lockup {
        display:block
    }
}

.dancer-lockup:first-of-type .dancer-copy-container {
    margin-top: 30vh
}

@media only screen and (max-width: 734px) {
    .dancer-lockup:first-of-type .dancer-copy-container {
        margin-top:0
    }
}

html.android .dancer-lockup:first-of-type .dancer-copy-container,html.no-autoplay .dancer-lockup:first-of-type .dancer-copy-container,html.no-enhanced .dancer-lockup:first-of-type .dancer-copy-container,html.no-heavy-media .dancer-lockup:first-of-type .dancer-copy-container,html.no-js .dancer-lockup:first-of-type .dancer-copy-container {
    margin-top: 0
}

.dancer-copy-container {
    z-index: 2
}

@media only screen and (max-width: 734px) {
    .dancer-copy-container {
        margin-bottom:40px
    }
}

html.android .dancer-copy-container,html.no-autoplay .dancer-copy-container,html.no-enhanced .dancer-copy-container,html.no-heavy-media .dancer-copy-container,html.no-js .dancer-copy-container {
    margin-top: 0;
    width: 100%;
    height: auto;
    padding-top: 100px
}

@media only screen and (max-width: 1068px) {
    html.android .dancer-copy-container,html.no-autoplay .dancer-copy-container,html.no-enhanced .dancer-copy-container,html.no-heavy-media .dancer-copy-container,html.no-js .dancer-copy-container {
        padding-top:50px
    }
}

@media only screen and (max-width: 734px) {
    html.android .dancer-copy-container,html.no-autoplay .dancer-copy-container,html.no-enhanced .dancer-copy-container,html.no-heavy-media .dancer-copy-container,html.no-js .dancer-copy-container {
        padding-top:160px
    }
}

.dancer-copy-section-content {
    position: relative;
    display: flex;
    flex-direction: column
}

@media only screen and (max-width: 734px) {
    .dancer-copy-section-content {
        height:100%;
        justify-content: flex-end
    }
}

@media only screen and (max-width: 734px) {
    html.android .dancer-copy-section-content,html.no-autoplay .dancer-copy-section-content,html.no-enhanced .dancer-copy-section-content,html.no-heavy-media .dancer-copy-section-content,html.no-js .dancer-copy-section-content {
        margin-top:25vh;
        align-items: center
    }
}

@supports(transform: translateY(calc(100dvh - 100vh))) {
    @media only screen and (max-width:734px) {
        html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.no-autoplay) .dancer-copy-section-content {
            transform:translateY(calc(100dvh - 100vh));
            transition: transform .1s ease
        }
    }
}

.dancer-copy {
    margin-top: 150px;
    color: #fff
}

.dancer-copy:first-of-type {
    z-index: 1
}

html.mq-medium-short .dancer-copy {
    margin-top: 30px
}

@media only screen and (max-width: 734px) {
    .dancer-copy {
        margin-top:0;
        position: absolute
    }
}

html.android .dancer-copy,html.no-autoplay .dancer-copy,html.no-enhanced .dancer-copy,html.no-heavy-media .dancer-copy,html.no-js .dancer-copy {
    opacity: 1!important;
    position: relative;
    margin-top: 0;
    margin-bottom: 50px;
    max-width: 38%
}

@media only screen and (min-width: 1069px) {
    html.android .dancer-copy:before,html.no-autoplay .dancer-copy:before,html.no-enhanced .dancer-copy:before,html.no-heavy-media .dancer-copy:before,html.no-js .dancer-copy:before {
        content:"";
        background-image: radial-gradient(rgba(0,0,0,0.6) 45%,transparent 70%);
        display: block;
        position: absolute;
        z-index: -1;
        top: -50%;
        bottom: -50%;
        right: -50%;
        left: -50%;
        pointer-events: none
    }
}

html.android .dancer-copy:last-of-type,html.no-autoplay .dancer-copy:last-of-type,html.no-enhanced .dancer-copy:last-of-type,html.no-heavy-media .dancer-copy:last-of-type,html.no-js .dancer-copy:last-of-type {
    margin-bottom: 30px
}

@media only screen and (max-width: 1068px) {
    html.android .dancer-copy:last-of-type,html.no-autoplay .dancer-copy:last-of-type,html.no-enhanced .dancer-copy:last-of-type,html.no-heavy-media .dancer-copy:last-of-type,html.no-js .dancer-copy:last-of-type {
        margin-bottom:20px
    }
}

@media only screen and (max-width: 734px) {
    html.android .dancer-copy:last-of-type,html.no-autoplay .dancer-copy:last-of-type,html.no-enhanced .dancer-copy:last-of-type,html.no-heavy-media .dancer-copy:last-of-type,html.no-js .dancer-copy:last-of-type {
        margin-bottom:0px
    }
}

@media only screen and (max-width: 1068px) {
    html.android .dancer-copy,html.no-autoplay .dancer-copy,html.no-enhanced .dancer-copy,html.no-heavy-media .dancer-copy,html.no-js .dancer-copy {
        margin-bottom:60px;
        max-width: 45%
    }
}

@media only screen and (max-width: 734px) {
    html.android .dancer-copy,html.no-autoplay .dancer-copy,html.no-enhanced .dancer-copy,html.no-heavy-media .dancer-copy,html.no-js .dancer-copy {
        max-width:100%
    }
}

html.text-zoom .dancer-copy {
    max-width: 100%
}

@media only screen and (min-width: 735px) {
    .nowrap-l-m {
        white-space:nowrap
    }
}

html.text-zoom .nowrap-l-m {
    white-space: normal
}

.timeline-dancer-sequence {
    display: none
}

@media only screen and (max-width: 734px) {
    .timeline-dancer-sequence {
        display:block;
        position: relative;
        height: calc(320vh - var(--r-localnav-height))
    }
}

html.android .timeline-dancer-sequence,html.no-autoplay .timeline-dancer-sequence,html.no-enhanced .timeline-dancer-sequence,html.no-heavy-media .timeline-dancer-sequence,html.no-js .timeline-dancer-sequence {
    display: none
}

@media only screen and (max-width: 734px) {
    .dancer-video-container {
        position:absolute;
        top: 0
    }
}

@media only screen and (min-width: 735px) {
    .dancer-video-container {
        top:var(--r-localnav-height);
        position: sticky
    }
}

html.android .dancer-video-container,html.no-autoplay .dancer-video-container,html.no-enhanced .dancer-video-container,html.no-heavy-media .dancer-video-container,html.no-js .dancer-video-container {
    display: none
}

#dancer-video {
    width: 100%;
    height: calc(100vh - var(--r-localnav-height));
    object-fit: cover;
    object-position: top
}

html.android #dancer-video,html.no-autoplay #dancer-video,html.no-enhanced #dancer-video,html.no-heavy-media #dancer-video,html.no-js #dancer-video {
    display: none
}

.near-section #dancer-video,.near-section .dancer-copy {
    will-change: transform,opacity
}

html.android .overview-static-fallback-listening,html.no-autoplay .overview-static-fallback-listening,html.no-enhanced .overview-static-fallback-listening,html.no-heavy-media .overview-static-fallback-listening,html.no-js .overview-static-fallback-listening {
    top: 0;
    position: absolute;
    width: 100%;
    height: -moz-fit-content;
    height: fit-content
}

@media only screen and (min-width: 735px) {
    html.android .overview-static-fallback-listening::after,html.no-autoplay .overview-static-fallback-listening::after,html.no-enhanced .overview-static-fallback-listening::after,html.no-heavy-media .overview-static-fallback-listening::after,html.no-js .overview-static-fallback-listening::after {
        content:"";
        position: absolute;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        background: linear-gradient(rgba(0,0,0,0) 85%,black);
        pointer-events: none
    }
}

html.android .overview-static-fallback-listening img,html.no-autoplay .overview-static-fallback-listening img,html.no-enhanced .overview-static-fallback-listening img,html.no-heavy-media .overview-static-fallback-listening img,html.no-js .overview-static-fallback-listening img {
    width: 100%
}

.overview-static-fallback-listening {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 1440px;
    --p-height: 810px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-static-fallback-listening {
        --p-width:1068px;
        --p-height: 600px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .overview-static-fallback-listening {
        --p-width:734px;
        --p-height: 520px
    }
}

.section-case-battery {
    --translate-distance: 20px;
    padding-top: 170px
}

@media only screen and (max-width: 734px) {
    .section-case-battery {
        --translate-distance:10px
    }

    html.no-enhanced .section-case-battery {
        margin-bottom: 50px
    }
}

@media only screen and (max-width: 1068px) {
    .section-case-battery {
        padding-top:154px
    }
}

@media only screen and (max-width: 734px) {
    .section-case-battery {
        padding-top:138px
    }
}

.section-case-battery .case-battery__intro {
    position: relative;
    z-index: 1;
    pointer-events: auto
}

.section-case-battery .bento-cell--factoids {
    overflow: hidden
}

@media only screen and (min-width: 735px) {
    .section-case-battery .bento-cell--factoids {
        padding-left:30px;
        padding-right: 30px
    }
}

.section-case-battery .bento-cell--factoids>div {
    z-index: 1
}

.section-case-battery .factoid-anc {
    margin-bottom: 100px
}

@media only screen and (max-width: 1068px) {
    .section-case-battery .factoid-anc {
        margin-bottom:80px
    }
}

.section-case-battery .factoid .stat-number,.section-case-battery .factoid .stat-unit {
    margin-top: -14px
}

.section-case-battery .bento-cell--magsafe {
    flex-direction: column;
    justify-content: flex-start
}

.section-case-battery .bento-cell__img--magsafe {
    display: inherit;
    justify-content: center;
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 602px;
    --p-height: 496px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .section-case-battery .bento-cell__img--magsafe {
        --p-width:327px;
        --p-height: 329px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .section-case-battery .bento-cell__img--magsafe {
        --p-width:478px;
        --p-height: 297px
    }
}

.section-case-battery .bento-cell__img--magsafe img {
    position: absolute;
    bottom: 0;
    margin-left: -61px
}

@media only screen and (max-width: 1068px) {
    .section-case-battery .bento-cell__img--magsafe img {
        margin-left:-30px
    }
}

@media only screen and (max-width: 734px) {
    .section-case-battery .bento-cell__img--magsafe img {
        margin-left:0px
    }
}

html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-case-battery .bento-container {
    margin-bottom: 0
}

html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-case-battery .case-battery__scroll-container {
    height: 250vh;
    margin-bottom: 100px
}

@media only screen and (max-width: 1068px) {
    html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-case-battery .case-battery__scroll-container {
        margin-bottom:90px
    }
}

@media only screen and (max-width: 734px) {
    html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-case-battery .case-battery__scroll-container {
        margin-bottom:80px
    }
}

.section-case-battery .case-battery__scroll-content {
    overflow: hidden
}

html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-case-battery .case-battery__scroll-content {
    height: 100vh;
    position: sticky;
    top: 0;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center
}

html.enhanced .section-case-battery .case-battery__scroll-content.near-section .copy {
    will-change: transform,opacity
}

html.android .section-case-battery .case-battery__scroll-container,html.mq-large-up-shorter .section-case-battery .case-battery__scroll-container,html.mq-medium-short .section-case-battery .case-battery__scroll-container,html.no-autoplay .section-case-battery .case-battery__scroll-container,html.no-enhanced .section-case-battery .case-battery__scroll-container,html.no-heavy-media .section-case-battery .case-battery__scroll-container,html.no-js .section-case-battery .case-battery__scroll-container,html.text-zoom .section-case-battery .case-battery__scroll-container {
    padding-top: 200px
}

@media only screen and (max-width: 1068px) {
    html.android .section-case-battery .case-battery__scroll-container,html.mq-large-up-shorter .section-case-battery .case-battery__scroll-container,html.mq-medium-short .section-case-battery .case-battery__scroll-container,html.no-autoplay .section-case-battery .case-battery__scroll-container,html.no-enhanced .section-case-battery .case-battery__scroll-container,html.no-heavy-media .section-case-battery .case-battery__scroll-container,html.no-js .section-case-battery .case-battery__scroll-container,html.text-zoom .section-case-battery .case-battery__scroll-container {
        padding-top:150px
    }
}

@media only screen and (max-width: 734px) {
    html.android .section-case-battery .case-battery__scroll-container,html.mq-large-up-shorter .section-case-battery .case-battery__scroll-container,html.mq-medium-short .section-case-battery .case-battery__scroll-container,html.no-autoplay .section-case-battery .case-battery__scroll-container,html.no-enhanced .section-case-battery .case-battery__scroll-container,html.no-heavy-media .section-case-battery .case-battery__scroll-container,html.no-js .section-case-battery .case-battery__scroll-container,html.text-zoom .section-case-battery .case-battery__scroll-container {
        padding-top:140px
    }
}

.section-case-battery .scroll-copy-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column
}

html.android .section-case-battery .scroll-copy-wrapper,html.mq-large-up-shorter .section-case-battery .scroll-copy-wrapper,html.mq-medium-short .section-case-battery .scroll-copy-wrapper,html.no-autoplay .section-case-battery .scroll-copy-wrapper,html.no-enhanced .section-case-battery .scroll-copy-wrapper,html.no-heavy-media .section-case-battery .scroll-copy-wrapper,html.no-js .section-case-battery .scroll-copy-wrapper,html.text-zoom .section-case-battery .scroll-copy-wrapper {
    position: relative
}

html.android .section-case-battery .scroll-copy-wrapper:not(:last-child),html.mq-large-up-shorter .section-case-battery .scroll-copy-wrapper:not(:last-child),html.mq-medium-short .section-case-battery .scroll-copy-wrapper:not(:last-child),html.no-autoplay .section-case-battery .scroll-copy-wrapper:not(:last-child),html.no-enhanced .section-case-battery .scroll-copy-wrapper:not(:last-child),html.no-heavy-media .section-case-battery .scroll-copy-wrapper:not(:last-child),html.no-js .section-case-battery .scroll-copy-wrapper:not(:last-child),html.text-zoom .section-case-battery .scroll-copy-wrapper:not(:last-child) {
    margin-bottom: 150px
}

.section-case-battery .copy--scroll {
    position: relative;
    text-align: center
}

html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-case-battery .copy--scroll:not(.find-my) {
    opacity: 0
}

html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-case-battery .copy--scroll {
    position: absolute;
    top: calc(50vh + 277px)
}

@media only screen and (max-width: 1068px) {
    html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-case-battery .copy--scroll {
        top:calc(50vh + 209px)
    }
}

@media only screen and (max-width: 734px) {
    html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-case-battery .copy--scroll {
        top:calc(50vh + 167px)
    }
}

html.android .section-case-battery .copy--scroll,html.mq-large-up-shorter .section-case-battery .copy--scroll,html.mq-medium-short .section-case-battery .copy--scroll,html.no-autoplay .section-case-battery .copy--scroll,html.no-enhanced .section-case-battery .copy--scroll,html.no-heavy-media .section-case-battery .copy--scroll,html.no-js .section-case-battery .copy--scroll,html.text-zoom .section-case-battery .copy--scroll {
    margin-top: 40px
}

html.enhanced .section-case-battery .copy--scroll:not(.frontmost,.find-my) {
    pointer-events: none
}

html.android .section-case-battery .copy--scroll:not(.frontmost,.find-my),html.mq-large-up-shorter .section-case-battery .copy--scroll:not(.frontmost,.find-my),html.mq-medium-short .section-case-battery .copy--scroll:not(.frontmost,.find-my),html.no-autoplay .section-case-battery .copy--scroll:not(.frontmost,.find-my),html.no-enhanced .section-case-battery .copy--scroll:not(.frontmost,.find-my),html.no-heavy-media .section-case-battery .copy--scroll:not(.frontmost,.find-my),html.no-js .section-case-battery .copy--scroll:not(.frontmost,.find-my),html.text-zoom .section-case-battery .copy--scroll:not(.frontmost,.find-my) {
    pointer-events: auto
}

.section-case-battery .copy--scroll.frontmost {
    z-index: 2
}

@media only screen and (min-width: 1069px) {
    .section-case-battery .copy--scroll.lanyard,.section-case-battery .copy--scroll.speaker-case {
        text-align:left
    }
}

@media only screen and (min-width: 1069px) {
    html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-case-battery .copy--scroll.lanyard {
        top:calc(50vh + 122px);
        left: calc(50% + 167px)
    }
}

@media only screen and (min-width: 735px)and (max-width:1068px) {
    html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-case-battery .copy--scroll.lanyard {
        top:calc(50vh + 229px)
    }
}

@media only screen and (min-width: 1069px) {
    html.android .section-case-battery .copy--scroll.lanyard,html.mq-large-up-shorter .section-case-battery .copy--scroll.lanyard,html.mq-medium-short .section-case-battery .copy--scroll.lanyard,html.no-autoplay .section-case-battery .copy--scroll.lanyard,html.no-enhanced .section-case-battery .copy--scroll.lanyard,html.no-heavy-media .section-case-battery .copy--scroll.lanyard,html.no-js .section-case-battery .copy--scroll.lanyard,html.text-zoom .section-case-battery .copy--scroll.lanyard {
        top:208px;
        left: calc(50% + 167px);
        position: absolute;
        margin: 0
    }
}

@media only screen and (min-width: 1069px) {
    html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-case-battery .copy--scroll.speaker-case {
        left:calc(50% + 167px);
        top: calc(50vh + 219px)
    }
}

@media only screen and (max-width: 734px) {
    html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-case-battery .copy--scroll.speaker-case {
        top:calc(50vh + 141px)
    }
}

@media only screen and (min-width: 1069px) {
    html.android .section-case-battery .copy--scroll.speaker-case,html.mq-large-up-shorter .section-case-battery .copy--scroll.speaker-case,html.mq-medium-short .section-case-battery .copy--scroll.speaker-case,html.no-autoplay .section-case-battery .copy--scroll.speaker-case,html.no-enhanced .section-case-battery .copy--scroll.speaker-case,html.no-heavy-media .section-case-battery .copy--scroll.speaker-case,html.no-js .section-case-battery .copy--scroll.speaker-case,html.text-zoom .section-case-battery .copy--scroll.speaker-case {
        left:calc(50% + 167px);
        align-self: flex-start;
        margin-top: 60px
    }
}

.section-case-battery .copy--scroll.find-my {
    max-width: 390px
}

@media only screen and (max-width: 1068px) {
    .section-case-battery .copy--scroll.find-my {
        max-width:335px
    }
}

@media only screen and (max-width: 734px) {
    .section-case-battery .copy--scroll.find-my {
        max-width:279px
    }
}

.section-case-battery .copy--scroll.lanyard {
    max-width: 325px
}

@media only screen and (max-width: 1068px) {
    .section-case-battery .copy--scroll.lanyard {
        max-width:315px
    }
}

@media only screen and (max-width: 734px) {
    .section-case-battery .copy--scroll.lanyard {
        max-width:275px
    }
}

.section-case-battery .copy--scroll.speaker-case {
    max-width: 345px
}

@media only screen and (max-width: 1068px) {
    .section-case-battery .copy--scroll.speaker-case {
        max-width:375px
    }
}

@media only screen and (max-width: 734px) {
    .section-case-battery .copy--scroll.speaker-case {
        max-width:275px
    }
}

.section-case-battery .copy--scroll.water-resistant {
    max-width: 390px
}

@media only screen and (max-width: 1068px) {
    .section-case-battery .copy--scroll.water-resistant {
        max-width:300px
    }
}

@media only screen and (max-width: 734px) {
    .section-case-battery .copy--scroll.water-resistant {
        max-width:260px
    }
}

.section-case-battery .pin-overflow-container {
    position: absolute;
    overflow: hidden;
    width: 10px;
    display: flex;
    justify-content: center
}

.section-case-battery .pin {
    top: 3px
}

.section-case-battery .pin-overflow-container.lanyard {
    left: 50%
}

@media only screen and (min-width: 1069px) {
    .section-case-battery .pin-overflow-container.lanyard {
        transform:rotate(270deg);
        transform-origin: top;
        margin-left: -7px
    }
}

@media only screen and (max-width: 1068px) {
    .section-case-battery .pin-overflow-container.lanyard {
        margin-left:-5px;
        margin-top: -3px
    }
}

html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-case-battery .pin-overflow-container.lanyard {
    height: 429px;
    top: calc(50vh + 99px)
}

@media only screen and (max-width: 1068px) {
    html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-case-battery .pin-overflow-container.lanyard {
        height:143px;
        top: calc(50vh + 72px)
    }
}

@media only screen and (max-width: 734px) {
    html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-case-battery .pin-overflow-container.lanyard {
        height:97px;
        top: calc(50vh + 54px)
    }
}

html.android .section-case-battery .pin-overflow-container.lanyard,html.mq-large-up-shorter .section-case-battery .pin-overflow-container.lanyard,html.mq-medium-short .section-case-battery .pin-overflow-container.lanyard,html.no-autoplay .section-case-battery .pin-overflow-container.lanyard,html.no-enhanced .section-case-battery .pin-overflow-container.lanyard,html.no-heavy-media .section-case-battery .pin-overflow-container.lanyard,html.no-js .section-case-battery .pin-overflow-container.lanyard,html.text-zoom .section-case-battery .pin-overflow-container.lanyard {
    height: 427px;
    top: 185px
}

@media only screen and (max-width: 1068px) {
    html.android .section-case-battery .pin-overflow-container.lanyard,html.mq-large-up-shorter .section-case-battery .pin-overflow-container.lanyard,html.mq-medium-short .section-case-battery .pin-overflow-container.lanyard,html.no-autoplay .section-case-battery .pin-overflow-container.lanyard,html.no-enhanced .section-case-battery .pin-overflow-container.lanyard,html.no-heavy-media .section-case-battery .pin-overflow-container.lanyard,html.no-js .section-case-battery .pin-overflow-container.lanyard,html.text-zoom .section-case-battery .pin-overflow-container.lanyard {
        height:134px;
        top: 134px
    }
}

@media only screen and (max-width: 734px) {
    html.android .section-case-battery .pin-overflow-container.lanyard,html.mq-large-up-shorter .section-case-battery .pin-overflow-container.lanyard,html.mq-medium-short .section-case-battery .pin-overflow-container.lanyard,html.no-autoplay .section-case-battery .pin-overflow-container.lanyard,html.no-enhanced .section-case-battery .pin-overflow-container.lanyard,html.no-heavy-media .section-case-battery .pin-overflow-container.lanyard,html.no-js .section-case-battery .pin-overflow-container.lanyard,html.text-zoom .section-case-battery .pin-overflow-container.lanyard {
        height:98px;
        top: 101px
    }
}

.section-case-battery .pin-overflow-container.speaker-case {
    margin-left: -5px
}

@media only screen and (max-width: 1068px) {
    .section-case-battery .pin-overflow-container.speaker-case {
        margin-top:-3px
    }
}

html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-case-battery .pin-overflow-container.speaker-case {
    top: calc(50vh + 80px);
    left: calc(50% + 138px);
    height: 284px
}

@media only screen and (max-width: 1068px) {
    html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-case-battery .pin-overflow-container.speaker-case {
        top:calc(50vh + 62px);
        left: calc(50% + 98px);
        height: 134px
    }
}

@media only screen and (max-width: 734px) {
    html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-case-battery .pin-overflow-container.speaker-case {
        top:calc(50vh + 46px);
        left: calc(50% + 74px);
        height: 80px
    }
}

html.android .section-case-battery .pin-overflow-container.speaker-case,html.mq-large-up-shorter .section-case-battery .pin-overflow-container.speaker-case,html.mq-medium-short .section-case-battery .pin-overflow-container.speaker-case,html.no-autoplay .section-case-battery .pin-overflow-container.speaker-case,html.no-enhanced .section-case-battery .pin-overflow-container.speaker-case,html.no-heavy-media .section-case-battery .pin-overflow-container.speaker-case,html.no-js .section-case-battery .pin-overflow-container.speaker-case,html.text-zoom .section-case-battery .pin-overflow-container.speaker-case {
    top: 80px;
    left: calc(50% + 138px);
    height: 265px
}

@media only screen and (max-width: 1068px) {
    html.android .section-case-battery .pin-overflow-container.speaker-case,html.mq-large-up-shorter .section-case-battery .pin-overflow-container.speaker-case,html.mq-medium-short .section-case-battery .pin-overflow-container.speaker-case,html.no-autoplay .section-case-battery .pin-overflow-container.speaker-case,html.no-enhanced .section-case-battery .pin-overflow-container.speaker-case,html.no-heavy-media .section-case-battery .pin-overflow-container.speaker-case,html.no-js .section-case-battery .pin-overflow-container.speaker-case,html.text-zoom .section-case-battery .pin-overflow-container.speaker-case {
        top:60px;
        left: calc(50% + 98px);
        height: 90px
    }
}

@media only screen and (max-width: 734px) {
    html.android .section-case-battery .pin-overflow-container.speaker-case,html.mq-large-up-shorter .section-case-battery .pin-overflow-container.speaker-case,html.mq-medium-short .section-case-battery .pin-overflow-container.speaker-case,html.no-autoplay .section-case-battery .pin-overflow-container.speaker-case,html.no-enhanced .section-case-battery .pin-overflow-container.speaker-case,html.no-heavy-media .section-case-battery .pin-overflow-container.speaker-case,html.no-js .section-case-battery .pin-overflow-container.speaker-case,html.text-zoom .section-case-battery .pin-overflow-container.speaker-case {
        top:48px;
        left: calc(50% + 74px);
        height: 71px
    }
}

html.android .section-case-battery video,html.mq-large-up-shorter .section-case-battery video,html.mq-medium-short .section-case-battery video,html.no-autoplay .section-case-battery video,html.no-enhanced .section-case-battery video,html.no-heavy-media .section-case-battery video,html.no-js .section-case-battery video,html.text-zoom .section-case-battery video {
    display: none
}

html.text-zoom .section-case-battery .scroll-copy-wrapper .copy--scroll {
    opacity: 1;
    top: auto;
    left: auto;
    position: relative;
    text-align: center;
    align-self: auto;
    max-width: 700px
}

html.android .section-case-battery .fallback-image,html.mq-large-up-shorter .section-case-battery .fallback-image,html.mq-medium-short .section-case-battery .fallback-image,html.no-autoplay .section-case-battery .fallback-image,html.no-enhanced .section-case-battery .fallback-image,html.no-heavy-media .section-case-battery .fallback-image,html.no-js .section-case-battery .fallback-image,html.text-zoom .section-case-battery .fallback-image {
    display: block
}

@media only screen and (max-width: 734px) {
    html.text-zoom .section-case-battery .eyebrow-section {
        font-size:20px
    }
}

html.text-zoom .section-case-battery .headline-section {
    font-size: 65px
}

@media only screen and (max-width: 1068px) {
    html.text-zoom .section-case-battery .headline-section {
        font-size:50px
    }
}

@media only screen and (max-width: 734px) {
    html.text-zoom .section-case-battery .headline-section {
        font-size:27px
    }
}

html.text-zoom .section-case-battery .intro-copy {
    max-width: none
}

@media only screen and (max-width: 734px) {
    html.text-zoom .section-case-battery .intro-copy {
        font-size:17px
    }
}

html.text-zoom .section-case-battery .bento-cell {
    padding-left: 10px;
    padding-right: 10px
}

html.text-zoom .section-case-battery .bento-cell-copy {
    max-width: 100%
}

html.text-zoom .section-case-battery .bento-cell-copy p {
    font-size: 15px
}

html.text-zoom .section-case-battery .stat-number,html.text-zoom .section-case-battery .stat-unit {
    font-size: 50px
}

@media only screen and (max-width: 734px) {
    html.text-zoom .section-case-battery .stat-number,html.text-zoom .section-case-battery .stat-unit {
        font-size:35px
    }
}

html.text-zoom .section-case-battery .pin {
    display: none
}

.overview-case-front {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 443px;
    --p-height: 484px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-case-front {
        --p-width:321px;
        --p-height: 353px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .overview-case-front {
        --p-width:243px;
        --p-height: 267px
    }
}

.overview-case-closed {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 443px;
    --p-height: 330px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-case-closed {
        --p-width:321px;
        --p-height: 240px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .overview-case-closed {
        --p-width:243px;
        --p-height: 181px
    }
}

.overview-case-side {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 162px;
    --p-height: 329px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-case-side {
        --p-width:118px;
        --p-height: 240px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .overview-case-side {
        --p-width:90px;
        --p-height: 183px
    }
}

.overview-case-bottom {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 448px;
    --p-height: 164px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-case-bottom {
        --p-width:321px;
        --p-height: 117px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .overview-case-bottom {
        --p-width:243px;
        --p-height: 89px
    }
}

.section-magical-experience {
    --scroll-container-top-offset: -30vh;
    --setup-video-end-ML: "a0b - 110vh";
    --setup-video-end-S: "a0b - 110vh";
    --setup-video-end: var(--setup-video-end-ML);
    padding-top: 170px;
    padding-bottom: 170px
}

@media only screen and (max-width: 1068px) {
    html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-magical-experience {
        margin-top:-25vh
    }
}

@media only screen and (max-width: 734px) {
    html.enhanced:not(.text-zoom,.no-js,.no-heavy-media,.android,.mq-medium-short,.mq-large-up-shorter,.no-autoplay) .section-magical-experience {
        margin-top:-20vh
    }
}

@media only screen and (max-width: 734px) {
    .section-magical-experience {
        --setup-video-end:var(--setup-video-end-S);
        --scroll-container-top-offset: -35vh
    }
}

@media only screen and (max-width: 1068px) {
    .section-magical-experience {
        padding-top:154px;
        padding-bottom: 154px
    }
}

@media only screen and (max-width: 734px) {
    .section-magical-experience {
        padding-top:138px;
        padding-bottom: 138px
    }
}

.section-magical-experience .copy strong {
    display: block
}

.section-magical-experience.near-section .copy--scroll {
    will-change: transform,opacity
}

.section-magical-experience.near-section .magical-screen {
    will-change: opacity
}

html.mq-medium-short .section-magical-experience .fallback-image,html.mq-small-short .section-magical-experience .fallback-image,html.text-zoom .section-magical-experience .fallback-image {
    display: initial
}

@media only screen and (max-width: 734px) {
    html.text-zoom .section-magical-experience .eyebrow-section {
        font-size:20px
    }
}

html.text-zoom .section-magical-experience .headline-section {
    font-size: 65px
}

@media only screen and (max-width: 1068px) {
    html.text-zoom .section-magical-experience .headline-section {
        font-size:50px
    }
}

@media only screen and (max-width: 734px) {
    html.text-zoom .section-magical-experience .headline-section {
        font-size:27px
    }
}

html.text-zoom .section-magical-experience .magical-lockup-wrap .copy--scroll {
    font-size: 17px;
    width: -moz-fit-content;
    width: fit-content;
    max-width: none;
    pointer-events: auto
}

@media only screen and (min-width: 735px)and (max-width:1068px) {
    html.text-zoom .section-magical-experience .magical-lockup-wrap .copy--scroll {
        left:50%;
        transform: translateX(-50%);
        right: auto;
        top: calc(100% + 30px);
        width: 85vw
    }
}

@media only screen and (min-width: 735px)and (max-width:1068px) {
    html.text-zoom .section-magical-experience .magical-lockup-wrap {
        margin-bottom:15em
    }
}

html.enhanced .magical-intro .intro-copy {
    margin-bottom: 50px
}

@media only screen and (max-width: 1068px) {
    html.enhanced .magical-intro .intro-copy {
        margin-bottom:0px
    }
}

@media only screen and (max-width: 734px) {
    html.enhanced .magical-intro .intro-copy {
        margin-bottom:50px
    }
}

html.mq-medium-short .magical-intro .intro-copy {
    margin-bottom: 74px
}

.magical-scroll-container {
    margin-top: 0
}

html.enhanced .magical-scroll-container {
    height: 200vh;
    margin-top: var(--scroll-container-top-offset);
    pointer-events: none
}

html.mq-medium-short .magical-scroll-container,html.mq-small-short .magical-scroll-container,html.text-zoom .magical-scroll-container {
    height: auto;
    margin-top: 0
}

html.enhanced .magical-scroll-container.allow-pointer-events {
    pointer-events: auto
}

html.enhanced .magical-scroll-content {
    height: 100vh;
    top: 0;
    position: sticky
}

html.mq-medium-short .magical-scroll-content,html.mq-small-short .magical-scroll-content,html.text-zoom .magical-scroll-content {
    height: auto;
    top: auto;
    position: static
}

@media only screen and (max-width: 734px) {
    .magical-scroll-content {
        width:100%
    }
}

.magical-screen {
    mask-image: url(../../images/overview/magical_iphone_mask__elfafte4tuye_large.png);
    mask-size: 288px 624px;
    mask-repeat: no-repeat;
    z-index: 3
}

@media (min-resolution: 144dpi),only screen and (min-resolution:1.5dppx) {
    .magical-screen {
        mask-image:url(../../images/overview/magical_iphone_mask__elfafte4tuye_large_2x.png)
    }
}

@media only screen and (max-width: 1068px) {
    .magical-screen {
        mask-image:url(../../images/overview/magical_iphone_mask__elfafte4tuye_medium.png);
        mask-size: 203px 439px;
        mask-repeat: no-repeat
    }
}

@media only screen and (max-width: 1068px)and (min-resolution:1.5dppx),only screen and (max-width:1068px)and (min-resolution:144dpi) {
    .magical-screen {
        mask-image:url(../../images/overview/magical_iphone_mask__elfafte4tuye_medium_2x.png)
    }
}

@media only screen and (max-width: 734px) {
    .magical-screen {
        mask-image:url(../../images/overview/magical_iphone_mask__elfafte4tuye_small.png);
        mask-size: 162px 348px;
        mask-repeat: no-repeat
    }
}

@media only screen and (max-width: 734px)and (min-resolution:1.5dppx),only screen and (max-width:734px)and (min-resolution:144dpi) {
    .magical-screen {
        mask-image:url(../../images/overview/magical_iphone_mask__elfafte4tuye_small_2x.png)
    }
}

.magical-hardware {
    z-index: 1;
    margin-top: 4px
}

@media only screen and (max-width: 1068px) {
    .magical-hardware {
        margin-top:3px
    }
}

.magical-lockup-wrap {
    --s-hw-offset: 15vh
}

@media only screen and (max-width: 734px)and (max-height:750px) {
    .magical-lockup-wrap {
        --s-hw-offset:20vh
    }
}

@media only screen and (max-width: 734px)and (max-height:720px) {
    .magical-lockup-wrap {
        --s-hw-offset:25vh
    }
}

html.mq-medium-short .magical-lockup-wrap,html.mq-small-short .magical-lockup-wrap,html.no-enhanced .magical-lockup-wrap,html.no-js .magical-lockup-wrap,html.text-zoom .magical-lockup-wrap {
    margin-bottom: 200px
}

@media only screen and (max-width: 1068px) {
    html.mq-medium-short .magical-lockup-wrap,html.mq-small-short .magical-lockup-wrap,html.no-enhanced .magical-lockup-wrap,html.no-js .magical-lockup-wrap,html.text-zoom .magical-lockup-wrap {
        margin-bottom:150px
    }
}

@media only screen and (max-width: 734px) {
    html.mq-medium-short .magical-lockup-wrap,html.mq-small-short .magical-lockup-wrap,html.no-enhanced .magical-lockup-wrap,html.no-js .magical-lockup-wrap,html.text-zoom .magical-lockup-wrap {
        width:100%;
        margin-bottom: 70px
    }
}

html.mq-medium-short .magical-lockup-wrap,html.mq-medium-short .magical-lockup-wrap .magical-hardware-wrap--static,html.mq-small-short .magical-lockup-wrap,html.mq-small-short .magical-lockup-wrap .magical-hardware-wrap--static,html.no-enhanced .magical-lockup-wrap,html.no-enhanced .magical-lockup-wrap .magical-hardware-wrap--static,html.no-js .magical-lockup-wrap,html.no-js .magical-lockup-wrap .magical-hardware-wrap--static,html.text-zoom .magical-lockup-wrap,html.text-zoom .magical-lockup-wrap .magical-hardware-wrap--static {
    position: relative
}

.magical-lockup-wrap:not(.loaded) video {
    mask-image: none!important
}

.magical-lockup-wrap .copy--scroll,.magical-lockup-wrap .magical-case,.magical-lockup-wrap .magical-screen {
    position: absolute
}

.magical-lockup-wrap .copy--scroll {
    max-width: 325px;
    width: 270px
}

@media only screen and (max-width: 1068px) {
    .magical-lockup-wrap .copy--scroll {
        width:190px
    }
}

@media only screen and (max-width: 734px) {
    .magical-lockup-wrap .copy--scroll {
        width:100%
    }
}

html.enhanced .magical-lockup-wrap .copy--scroll:not(.frontmost) {
    pointer-events: none
}

html.mq-medium-short .magical-lockup-wrap .copy--scroll:not(.frontmost),html.mq-small-short .magical-lockup-wrap .copy--scroll:not(.frontmost),html.text-zoom .magical-lockup-wrap .copy--scroll:not(.frontmost) {
    pointer-events: auto
}

html.mq-medium-short .magical-lockup-wrap .copy--scroll,html.mq-small-short .magical-lockup-wrap .copy--scroll,html.no-enhanced .magical-lockup-wrap .copy--scroll,html.no-js .magical-lockup-wrap .copy--scroll,html.text-zoom .magical-lockup-wrap .copy--scroll {
    left: calc(100% + 30px)
}

@media only screen and (min-width: 735px) {
    html.enhanced .magical-lockup-wrap .copy--scroll {
        right:0;
        top: 50%;
        transform: translateY(-50%)
    }
}

@media only screen and (max-width: 734px) {
    html.enhanced .magical-lockup-wrap .copy--scroll {
        --copy-end-position:calc(-50% + var(--p-height) - var(--s-hw-offset));
        transform: translateY(var(--copy-end-position));
        top: 50%
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    html.enhanced .magical-lockup-wrap .copy--scroll {
        --p-width:176px;
        --p-height: 362px
    }
}

@media only screen and (max-width: 734px) {
    html.mq-medium-short .magical-lockup-wrap .copy--scroll,html.mq-small-short .magical-lockup-wrap .copy--scroll,html.no-enhanced .magical-lockup-wrap .copy--scroll,html.no-js .magical-lockup-wrap .copy--scroll,html.text-zoom .magical-lockup-wrap .copy--scroll {
        position:relative;
        left: 0;
        align-self: flex-start;
        margin-top: 50px;
        transform: none;
        bottom: auto
    }
}

.magical-lockup-wrap .copy--scroll.frontmost {
    z-index: 5
}

html.enhanced .magical-case,html.enhanced .magical-hardware,html.enhanced .magical-screen {
    opacity: 0
}

@media only screen and (max-width: 734px) {
    html.enhanced .magical-case,html.enhanced .magical-hardware,html.enhanced .magical-screen {
        padding-bottom:var(--s-hw-offset)
    }
}

html.mq-medium-short .magical-case,html.mq-medium-short .magical-hardware,html.mq-medium-short .magical-screen,html.mq-small-short .magical-case,html.mq-small-short .magical-hardware,html.mq-small-short .magical-screen,html.text-zoom .magical-case,html.text-zoom .magical-hardware,html.text-zoom .magical-screen {
    padding-bottom: 0;
    opacity: 1
}

html.enhanced .magical-screen:not(.magical-screen--setup,.magical-video) {
    transition: opacity .3s ease-in
}

@media only screen and (min-width: 735px) {
    html.enhanced .magical-screen:not(.magical-screen--setup,.magical-video).show-ml {
        opacity:1
    }
}

@media only screen and (max-width: 734px) {
    html.enhanced .magical-screen:not(.magical-screen--setup,.magical-video).show-s {
        opacity:1
    }
}

html.enhanced .magical-hardware-wrap--enhanced {
    position: relative
}

html.enhanced .magical-lockup-wrap:not(:first-of-type) .magical-screen {
    top: 50%;
    transform: translateY(-50%)
}

html.mq-medium-short .magical-lockup-wrap:not(:first-of-type) .magical-screen,html.mq-small-short .magical-lockup-wrap:not(:first-of-type) .magical-screen,html.text-zoom .magical-lockup-wrap:not(:first-of-type) .magical-screen {
    top: auto;
    transform: none
}

.magical-case {
    bottom: 0;
    left: -185px;
    z-index: 4
}

@media only screen and (max-width: 1068px) {
    .magical-case {
        left:-130px
    }
}

@media only screen and (max-width: 734px) {
    .magical-case {
        left:-103px
    }
}

@media only screen and (max-width: 734px) {
    .magical-hardware-wrap {
        margin-left:103px
    }
}

html.no-js .magical-hardware-wrap noscript:first-of-type {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: absolute
}

.magical-stationary-copy-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 130px;
    column-gap: 130px;
    grid-row-gap: 80px;
    row-gap: 80px
}

@media only screen and (max-width: 734px) {
    .magical-stationary-copy-container {
        grid-template-columns:1fr;
        padding-top: 100px
    }
}

@media only screen and (min-width: 735px)and (max-width:1068px) {
    html.enhanced .magical-stationary-copy-container {
        margin-top:-100px
    }

    html.text-zoom .magical-stationary-copy-container {
        margin-top: 0px
    }
}

html.enhanced.mq-large-up-shorter .magical-stationary-copy-container {
    margin-top: 150px
}

.magical-stationary-copy-container .copy {
    margin: 0
}

.magical-icon {
    margin-bottom: 24px
}

@media only screen and (max-width: 1068px) {
    .magical-icon {
        margin-bottom:20px
    }
}

.magical-case::after {
    position: absolute;
    background-color: #9d9d9d;
    border-radius: 50%;
    width: 5px;
    height: 5px;
    top: 126px;
    left: 132px
}

html.enhanced .magical-case::after {
    content: ""
}

@media only screen and (max-width: 1068px) {
    .magical-case::after {
        width:4px;
        height: 4px;
        top: 89px;
        left: 94px
    }
}

@media only screen and (max-width: 734px) {
    .magical-case::after {
        width:3px;
        height: 3px;
        top: 70px;
        left: 74px
    }
}

.magical-case.animate::after,.playing .magical-case::after {
    animation: light-blink 1.3s infinite
}

.ended .magical-case::after,.magical-case.go-on-state::after {
    transition: background-color 200ms linear;
    background-color: #fff;
    animation: none
}

.magical-case.go-green::after {
    transition: background-color 200ms linear;
    background-color: #3aff76;
    animation: none
}

.magical-case.hide::after {
    opacity: 0;
    transition: opacity 200ms linear
}

@keyframes light-blink {
    0% {
        background-color: #9d9d9d
    }

    38.46% {
        background-color: #fff
    }

    50% {
        background-color: #fff
    }

    88.46% {
        background-color: #9d9d9d
    }

    100% {
        background-color: #9d9d9d
    }
}

.replay-button-wrapper {
    font-size: 14px;
    position: absolute;
    bottom: -40px;
    left: 0;
    color: #fff;
    z-index: 3;
    display: block
}

@media only screen and (max-width: 734px) {
    .replay-button-wrapper {
        bottom:-30px
    }
}

html.mq-medium-short .replay-button-wrapper,html.mq-small-short .replay-button-wrapper,html.no-enhanced .replay-button-wrapper,html.no-js .replay-button-wrapper,html.text-zoom .replay-button-wrapper {
    display: none
}

.replay-button-wrapper:hover {
    color: #fff
}

.replay-button-wrapper .replay-button {
    visibility: hidden;
    opacity: 0;
    transition: opacity .3s ease-in,visibility .31s;
    will-change: opacity
}

.replay-button-wrapper .replay-button.is-paused {
    visibility: visible;
    opacity: 1;
    transition: opacity .3s ease-in,visibility .29s
}

.replay-button-wrapper .replay-button:hover {
    text-decoration: underline
}

.replay-button-wrapper .replay-button.underline-fix:hover {
    text-decoration: none
}

.replay-button-wrapper .replay-button.underline-fix:hover .icon-copy {
    text-decoration: underline
}

.magical-lockup-wrap.ended .replay-button {
    visibility: visible;
    opacity: 1;
    transition: opacity .3s ease-in,visibility .29s
}

.magical-lockup-wrap.loaded .video-fallback-image {
    display: none
}

html.mq-medium-short .magical-lockup-wrap.loaded .video-fallback-image,html.mq-small-short .magical-lockup-wrap.loaded .video-fallback-image,html.no-autoplay .magical-lockup-wrap.loaded .video-fallback-image,html.text-zoom .magical-lockup-wrap.loaded .video-fallback-image {
    display: initial
}

.magical-screen.magical-video {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 288px;
    --p-height: 624px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .magical-screen.magical-video {
        --p-width:203px;
        --p-height: 439px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .magical-screen.magical-video {
        --p-width:162px;
        --p-height: 348px
    }
}

html.mq-medium-short .magical-screen.magical-video,html.mq-small-short .magical-screen.magical-video,html.no-autoplay .magical-screen.magical-video,html.no-enhanced .magical-screen.magical-video,html.no-js .magical-screen.magical-video,html.text-zoom .magical-screen.magical-video {
    display: none
}

.video-fallback-image {
    z-index: 2
}

.overview-magical-case {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 269px;
    --p-height: 229px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-magical-case {
        --p-width:191px;
        --p-height: 162px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .overview-magical-case {
        --p-width:150px;
        --p-height: 128px
    }
}

.overview-magical-iphone-hardware {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 316px;
    --p-height: 650px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-magical-iphone-hardware {
        --p-width:223px;
        --p-height: 458px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .overview-magical-iphone-hardware {
        --p-width:176px;
        --p-height: 362px
    }
}

.overview-magical-screen-audio {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 288px;
    --p-height: 624px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-magical-screen-audio {
        --p-width:203px;
        --p-height: 439px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .overview-magical-screen-audio {
        --p-width:162px;
        --p-height: 348px
    }
}

.overview-magical-screen-setup {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 288px;
    --p-height: 624px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-magical-screen-setup {
        --p-width:203px;
        --p-height: 439px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .overview-magical-screen-setup {
        --p-width:162px;
        --p-height: 348px
    }
}

.overview-icon-siri {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 41px;
    --p-height: 38px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-icon-siri {
        --p-width:33px;
        --p-height: 30px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .overview-icon-siri {
        --p-width:33px;
        --p-height: 30px
    }
}

.overview-icon-switching {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 41px;
    --p-height: 38px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-icon-switching {
        --p-width:33px;
        --p-height: 30px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .overview-icon-switching {
        --p-width:33px;
        --p-height: 30px
    }
}

.overview-icon-accessibility {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 41px;
    --p-height: 38px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-icon-accessibility {
        --p-width:33px;
        --p-height: 30px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .overview-icon-accessibility {
        --p-width:33px;
        --p-height: 30px
    }
}

.overview-icon-notifications {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 41px;
    --p-height: 38px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-icon-notifications {
        --p-width:33px;
        --p-height: 30px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .overview-icon-notifications {
        --p-width:33px;
        --p-height: 30px
    }
}

.section-ar {
    border-top: 10px solid #000;
    border-bottom: 10px solid #fff;
    background: #f5f5f7
}

.section-ar .section-content {
    padding-top: 67px;
    display: flex;
    justify-content: space-between;
    align-items: center
}

@media only screen and (max-width: 1068px) {
    .section-ar .section-content {
        padding-top:61px;
        align-items: flex-start
    }
}

@media only screen and (max-width: 734px) {
    .section-ar .section-content {
        padding-top:34px;
        flex-direction: column
    }
}

@media only screen and (min-width: 735px)and (max-width:1068px) {
    .section-ar .image-ar {
        position:relative;
        right: 33px
    }
}

.section-ar .icon-ar {
    padding-bottom: 20px
}

@media only screen and (max-width: 1068px) {
    .section-ar .icon-ar {
        padding-bottom:14px
    }
}

.section-ar .banner-copy {
    max-width: 306px;
    padding-bottom: 70px
}

@media only screen and (max-width: 1068px) {
    .section-ar .banner-copy {
        padding-bottom:25px;
        padding-top: 5px
    }
}

@media only screen and (max-width: 734px) {
    .section-ar .banner-copy {
        padding-top:0;
        padding-bottom: 44px;
        align-self: flex-start
    }
}

@media only screen and (min-width: 735px)and (max-width:1068px) {
    html.text-zoom .section-ar .section-content {
        position:relative
    }
}

@media only screen and (min-width: 735px)and (max-width:1068px) {
    html.text-zoom .section-ar .image-ar {
        position:absolute;
        right: 0;
        bottom: 0
    }
}

.overview-use-ar-icon {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 53px;
    --p-height: 57px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-use-ar-icon {
        --p-width:38px;
        --p-height: 41px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .overview-use-ar-icon {
        --p-width:38px;
        --p-height: 41px
    }
}

.overview-router-ar {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 324px;
    --p-height: 421px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-router-ar {
        --p-width:261px;
        --p-height: 334px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .overview-router-ar {
        --p-width:246px;
        --p-height: 311px
    }
}

.section-engraving {
    position: relative;
    overflow: hidden;
    background: #f5f5f7;
    border-bottom: 10px solid #fff
}

.section-engraving .section-content {
    padding: 68px 0;
    display: flex;
    justify-content: space-between;
    align-items: center
}

@media only screen and (max-width: 1068px) {
    .section-engraving .section-content {
        padding:75px 0
    }
}

@media only screen and (max-width: 734px) {
    .section-engraving .section-content {
        flex-direction:column;
        align-items: flex-start;
        padding: 77px 0 76px
    }
}

.section-engraving .typography-router-tagline {
    margin-bottom: 12px;
    margin-top: 10px;
    width: 305px
}

@media only screen and (max-width: 1068px) {
    .section-engraving .typography-router-tagline {
        width:235px
    }
}

@media only screen and (max-width: 734px) {
    .section-engraving .typography-router-tagline {
        width:325px
    }
}

@media only screen and (max-width: 374px) {
    .section-engraving .typography-router-tagline {
        width:280px
    }
}

@media only screen and (max-width: 734px) {
    .section-engraving .banner-copy {
        align-self:flex-start;
        padding-bottom: 70px
    }
}

html.text-zoom .section-engraving .banner-copy {
    z-index: 2
}

.section-engraving .image-engraving {
    position: relative;
    left: 50%;
    margin-left: -112.5px
}

@media only screen and (max-width: 1068px) {
    .section-engraving .image-engraving {
        left:50%;
        margin-left: -154.5px
    }
}

@media only screen and (max-width: 734px) {
    .section-engraving .image-engraving {
        left:50%;
        margin-left: -167.5px
    }
}

@media only screen and (min-width: 1069px) {
    .section-engraving .image-engraving {
        padding-top:35px;
        padding-bottom: 70px
    }
}

@media only screen and (max-width: 734px) {
    .section-engraving .image-engraving {
        left:0;
        margin-left: unset
    }
}

.section-engraving .image-wrapper {
    width: 558px
}

@media only screen and (max-width: 1068px) {
    .section-engraving .image-wrapper {
        width:338px
    }
}

@media only screen and (max-width: 734px) {
    .section-engraving .image-wrapper {
        width:auto
    }
}

.section-engraving .banner-copy {
    width: 390px
}

@media only screen and (max-width: 1068px) {
    .section-engraving .banner-copy {
        width:320px
    }
}

@media only screen and (max-width: 734px) {
    .section-engraving .banner-copy {
        width:258px
    }
}

.overview-router-engraving {
    display: block;
    width: var(--p-width);
    height: var(--p-height);
    --p-width: 471px;
    --p-height: 251px
}

@media only screen and (max-width: 1068px)and (max-width:1068px) {
    .overview-router-engraving {
        --p-width:335px;
        --p-height: 179px
    }
}

@media only screen and (max-width: 734px)and (max-width:734px) {
    .overview-router-engraving {
        --p-width:335px;
        --p-height: 179px
    }
}

.section-apple-music {
    background-color: #f5f5f7;
    overflow: hidden
}

.section-apple-music .section-content {
    padding-top: 41px;
    padding-bottom: 70px
}

@media only screen and (max-width: 1068px) {
    .section-apple-music .section-content {
        padding-top:45px;
        padding-bottom: 56px
    }
}

@media only screen and (max-width: 734px) {
    .section-apple-music .section-content.row {
        padding-top:37px;
        padding-bottom: 75px;
        align-items: flex-start
    }
}

.section-apple-music .column-copy {
    display: grid;
    align-content: center
}

@media only screen and (max-width: 734px) {
    .section-apple-music .column-copy {
        display:block;
        margin-bottom: 30px;
        align-self: flex-start
    }
}

@media only screen and (max-width: 734px) {
    .section-apple-music .column-image {
        position:relative;
        display: flex;
        justify-content: center
    }
}

.section-apple-music .apple-music-logo {
    display: block;
    fill: currentColor;
    margin-bottom: 20px;
    width: 106px;
    height: 27px
}

@media only screen and (max-width: 1068px) {
    .section-apple-music .apple-music-logo {
        width:86px;
        margin-bottom: 13px;
        height: 21px
    }
}

@media only screen and (max-width: 734px) {
    .section-apple-music .apple-music-logo {
        margin-bottom:23px
    }
}

.section-apple-music .image-inner {
    width: 307px;
    height: 307px;
    padding-top: 62px;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    left: 88px
}

@media only screen and (max-width: 1068px) {
    .section-apple-music .image-inner {
        width:235px
    }
}

@media only screen and (max-width: 734px) {
    .section-apple-music .image-inner {
        width:205px
    }
}

@media only screen and (max-width: 1068px) {
    .section-apple-music .image-inner {
        height:235px
    }
}

@media only screen and (max-width: 734px) {
    .section-apple-music .image-inner {
        height:205px
    }
}

@media only screen and (max-width: 1068px) {
    .section-apple-music .image-inner {
        padding-top:44px;
        left: 14px
    }
}

@media only screen and (max-width: 734px) {
    .section-apple-music .image-inner {
        left:auto
    }
}

.section-apple-music .image-inner picture {
    line-height: 0
}

.section-apple-music .music-album-stack {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%)
}

.section-apple-music .music-airpods {
    z-index: 1;
    transform: translateX(-50%);
    position: absolute;
    left: 50%;
    top: 100px
}

@media only screen and (max-width: 1068px) {
    .section-apple-music .music-airpods {
        top:70px
    }
}

.section-apple-music .music-album-picture {
    display: block;
    position: relative;
    overflow: hidden;
    border-radius: 3.5%;
    width: 100%;
    height: 100%;
    will-change: transform,opacity
}

@media only screen and (max-width: 734px) {
    .section-apple-music .cta {
        margin-top:12px
    }
}

@media only screen and (min-width: 735px)and (max-width:1068px) {
    html.text-zoom .section-apple-music .column-image {
        position:relative
    }
}

@media only screen and (min-width: 735px)and (max-width:1068px) {
    html.text-zoom .section-apple-music .image-inner {
        position:absolute;
        right: 0;
        left: auto;
        bottom: 5%
    }
}

.section-compare {
    padding: 100px 0 150px;
    background-color: #fff
}

@media only screen and (max-width: 1068px) {
    .section-compare {
        padding:75px 0 120px
    }
}

@media only screen and (max-width: 734px) {
    .section-compare {
        padding-bottom:100px
    }
}

.section-compare .compare-module-wrapper {
    margin: 0 auto
}

@media only screen and (max-width: 734px) {
    .section-compare .compare-module-wrapper {
        padding:0 6.25%
    }
}

.section-compare .links-stacked a {
    color: #0070c9
}

.section-compare .links-stacked a.button {
    color: #fff
}

@keyframes ribbon-drop {
    0% {
        transform: translateY(-100%)
    }

    100% {
        transform: translateY(0)
    }
}

.ribbon {
    overflow: hidden;
    --ribbon-background-color: #f5f5f7;
    --ribbon-text-color: #1d1d1f;
    --ribbon-link-color: #0066cc;
    --ribbon-focus-color: rgba(0,125,250,0.6)
}

.ribbon-content-wrapper {
    text-align: center
}

.ribbon-content {
    margin-left: auto;
    margin-right: auto;
    width: 980px
}

@media only screen and (min-width: 1441px) {
    .ribbon-content {
        margin-left:auto;
        margin-right: auto;
        width: 980px
    }
}

@media only screen and (max-width: 1068px) {
    .ribbon-content {
        margin-left:auto;
        margin-right: auto;
        width: 692px
    }
}

@media only screen and (max-width: 734px) {
    .ribbon-content {
        margin-left:auto;
        margin-right: auto;
        width: 87.5%
    }
}

@media only screen and (max-width: 374px) {
    .ribbon-content {
        margin-left:auto;
        margin-right: auto;
        width: 87.5%
    }
}

.ribbon-link {
    white-space: nowrap
}

.ribbon-link:focus {
    text-decoration: underline
}

.ribbon .ribbon-content-wrapper {
    padding-top: .9411764706em;
    padding-bottom: .9411764706em
}

.ribbon .ribbon-content {
    font-size: 14px;
    line-height: 1.4285914286;
    font-weight: 400;
    letter-spacing: -0.016em;
    font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ribbon .ribbon-content:lang(ar) {
    letter-spacing: 0em;
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ribbon .ribbon-content:lang(ja) {
    letter-spacing: 0em;
    font-family: SF Pro JP,SF Pro Text,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ribbon .ribbon-content:lang(ko) {
    line-height: 1.5714285714;
    letter-spacing: 0em;
    font-family: SF Pro KR,SF Pro Text,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ribbon .ribbon-content:lang(zh) {
    line-height: 1.5;
    letter-spacing: 0em
}

.ribbon .ribbon-content:lang(th) {
    line-height: 1.3571828571;
    letter-spacing: 0em;
    font-family: SF Pro TH,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ribbon .ribbon-content:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Text,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ribbon .ribbon-content:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ribbon .ribbon-content:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ribbon .ribbon-content:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Text,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ribbon .ribbon-content-wrapper {
    background-color: var(--ribbon-background-color)
}

.ribbon .ribbon-content {
    color: var(--ribbon-text-color)
}

.ribbon .ribbon-link:focus {
    outline-color: var(--ribbon-focus-color)
}

.ribbon .ribbon-link {
    color: var(--ribbon-link-color)
}

.ribbon-elevated .ribbon-content-wrapper {
    padding-top: 1.4117647059em;
    padding-bottom: 1.4117647059em
}

.ribbon-elevated .ribbon-content {
    font-size: 17px;
    line-height: 1.4705882353;
    font-weight: 400;
    letter-spacing: -0.022em;
    font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ribbon-elevated .ribbon-content:lang(ar) {
    letter-spacing: 0em;
    font-family: SF Pro AR,SF Pro Gulf,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ribbon-elevated .ribbon-content:lang(ja) {
    letter-spacing: 0em;
    font-family: SF Pro JP,SF Pro Text,SF Pro Icons,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro W3,メイリオ,Meiryo,ＭＳ Ｐゴシック,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ribbon-elevated .ribbon-content:lang(ko) {
    line-height: 1.5882352941;
    letter-spacing: 0em;
    font-family: SF Pro KR,SF Pro Text,SF Pro Icons,Apple Gothic,HY Gulim,MalgunGothic,HY Dotum,Lexi Gulim,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ribbon-elevated .ribbon-content:lang(zh) {
    letter-spacing: 0em
}

.ribbon-elevated .ribbon-content:lang(th) {
    line-height: 1.3529611765;
    letter-spacing: 0em;
    font-family: SF Pro TH,SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ribbon-elevated .ribbon-content:lang(zh-CN) {
    font-family: SF Pro SC,SF Pro Text,SF Pro Icons,PingFang SC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ribbon-elevated .ribbon-content:lang(zh-HK) {
    font-family: SF Pro HK,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ribbon-elevated .ribbon-content:lang(zh-MO) {
    font-family: SF Pro HK,SF Pro TC,SF Pro Text,SF Pro Icons,PingFang HK,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ribbon-elevated .ribbon-content:lang(zh-TW) {
    font-family: SF Pro TC,SF Pro Text,SF Pro Icons,PingFang TC,Helvetica Neue,Helvetica,Arial,sans-serif
}

.ribbon-blue {
    --ribbon-background-color: #0071e3;
    --ribbon-text-color: white;
    --ribbon-link-color: white;
    --ribbon-focus-color: rgba(255,255,255,0.6)
}

.ribbon-blue .ribbon-content-wrapper {
    background-color: var(--ribbon-background-color)
}

.ribbon-blue .ribbon-content {
    color: var(--ribbon-text-color)
}

.ribbon-blue .ribbon-link:focus {
    outline-color: var(--ribbon-focus-color)
}

.ribbon-blue .ribbon-link {
    color: var(--ribbon-link-color)
}

.ribbon-blue-to-default {
    --ribbon-background-color: #f5f5f7;
    --ribbon-background-color-initial: #0071e3;
    --ribbon-text-color: #1d1d1f;
    --ribbon-text-color-initial: white;
    --ribbon-link-color: #0066cc;
    --ribbon-focus-color: rgba(0,125,250,0.6);
    --ribbon-link-color-initial: white
}

.ribbon-blue-to-default .ribbon-content-wrapper {
    background-color: var(--ribbon-background-color-initial);
    animation: animate-background-0071e3-f5f5f7 1s ease-in-out 1.8s forwards
}

@media(prefers-reduced-motion) {
    .ribbon-blue-to-default .ribbon-content-wrapper {
        background-color: var(--ribbon-background-color);
        animation: none
    }
}

.ribbon-blue-to-default .ribbon-content {
    color: var(--ribbon-text-color-initial);
    animation: animate-color-white-1d1d1f 1s ease-in-out 1.8s forwards
}

@media(prefers-reduced-motion) {
    .ribbon-blue-to-default .ribbon-content {
        color: var(--ribbon-text-color);
        animation: none
    }
}

.ribbon-blue-to-default .ribbon-link:focus {
    outline-color: var(--ribbon-focus-color)
}

.ribbon-blue-to-default .ribbon-link {
    color: var(--ribbon-link-color-initial);
    animation: animate-color-white-0066cc 1s ease-in-out 1.8s forwards
}

@media(prefers-reduced-motion) {
    .ribbon-blue-to-default .ribbon-link {
        color: var(--ribbon-link-color);
        animation: none
    }
}

.ribbon-drop-wrapper {
    animation: ribbon-drop .8s ease-in-out forwards
}

@media(prefers-reduced-motion) {
    .ribbon-drop-wrapper {
        animation: none
    }
}

.theme-dark.ribbon,.theme-dark .ribbon {
    --ribbon-background-color: #1d1d1f;
    --ribbon-text-color: #f5f5f7;
    --ribbon-link-color: #2997ff;
    --ribbon-focus-color: rgba(0,125,250,0.6)
}

.theme-dark.ribbon .ribbon-content-wrapper,.theme-dark .ribbon .ribbon-content-wrapper {
    background-color: var(--ribbon-background-color)
}

.theme-dark.ribbon .ribbon-content,.theme-dark .ribbon .ribbon-content {
    color: var(--ribbon-text-color)
}

.theme-dark.ribbon .ribbon-link:focus,.theme-dark .ribbon .ribbon-link:focus {
    outline-color: var(--ribbon-focus-color)
}

.theme-dark.ribbon .ribbon-link,.theme-dark .ribbon .ribbon-link {
    color: var(--ribbon-link-color)
}

.theme-dark.ribbon-blue,.theme-dark .ribbon-blue {
    --ribbon-background-color: #0071e3;
    --ribbon-text-color: white;
    --ribbon-link-color: white;
    --ribbon-focus-color: rgba(255,255,255,0.6)
}

.theme-dark.ribbon-blue .ribbon-content-wrapper,.theme-dark .ribbon-blue .ribbon-content-wrapper {
    background-color: var(--ribbon-background-color)
}

.theme-dark.ribbon-blue .ribbon-content,.theme-dark .ribbon-blue .ribbon-content {
    color: var(--ribbon-text-color)
}

.theme-dark.ribbon-blue .ribbon-link:focus,.theme-dark .ribbon-blue .ribbon-link:focus {
    outline-color: var(--ribbon-focus-color)
}

.theme-dark.ribbon-blue .ribbon-link,.theme-dark .ribbon-blue .ribbon-link {
    color: var(--ribbon-link-color)
}

.theme-dark.ribbon-blue-to-default,.theme-dark .ribbon-blue-to-default {
    --ribbon-background-color: #1d1d1f;
    --ribbon-background-color-initial: #0071e3;
    --ribbon-text-color: #f5f5f7;
    --ribbon-text-color-initial: white;
    --ribbon-link-color: #2997ff;
    --ribbon-focus-color: rgba(0,125,250,0.6);
    --ribbon-link-color-initial: white
}

@keyframes animate-background-0071e3-1d1d1f {
    0% {
        background-color: var(--ribbon-background-color-initial)
    }

    100% {
        background-color: var(--ribbon-background-color)
    }
}

.theme-dark.ribbon-blue-to-default .ribbon-content-wrapper,.theme-dark .ribbon-blue-to-default .ribbon-content-wrapper {
    background-color: var(--ribbon-background-color-initial);
    animation: animate-background-0071e3-1d1d1f 1s ease-in-out 1.8s forwards
}

@media(prefers-reduced-motion) {
    .theme-dark.ribbon-blue-to-default .ribbon-content-wrapper,.theme-dark .ribbon-blue-to-default .ribbon-content-wrapper {
        background-color: var(--ribbon-background-color);
        animation: none
    }
}

@keyframes animate-color-white-f5f5f7 {
    0% {
        color: var(--ribbon-text-color-initial)
    }

    100% {
        color: var(--ribbon-text-color)
    }
}

.theme-dark.ribbon-blue-to-default .ribbon-content,.theme-dark .ribbon-blue-to-default .ribbon-content {
    color: var(--ribbon-text-color-initial);
    animation: animate-color-white-f5f5f7 1s ease-in-out 1.8s forwards
}

@media(prefers-reduced-motion) {
    .theme-dark.ribbon-blue-to-default .ribbon-content,.theme-dark .ribbon-blue-to-default .ribbon-content {
        color: var(--ribbon-text-color);
        animation: none
    }
}

.theme-dark.ribbon-blue-to-default .ribbon-link:focus,.theme-dark .ribbon-blue-to-default .ribbon-link:focus {
    outline-color: var(--ribbon-focus-color)
}

@keyframes animate-color-white-2997ff {
    0% {
        color: var(--ribbon-link-color-initial)
    }

    100% {
        color: var(--ribbon-link-color)
    }
}

.theme-dark.ribbon-blue-to-default .ribbon-link,.theme-dark .ribbon-blue-to-default .ribbon-link {
    color: var(--ribbon-link-color-initial);
    animation: animate-color-white-2997ff 1s ease-in-out 1.8s forwards
}

@media(prefers-reduced-motion) {
    .theme-dark.ribbon-blue-to-default .ribbon-link,.theme-dark .ribbon-blue-to-default .ribbon-link {
        color: var(--ribbon-link-color);
        animation: none
    }
}

.theme-light.ribbon,.theme-light .ribbon {
    --ribbon-background-color: #f5f5f7;
    --ribbon-text-color: #1d1d1f;
    --ribbon-link-color: #0066cc;
    --ribbon-focus-color: rgba(0,125,250,0.6)
}

.theme-light.ribbon .ribbon-content-wrapper,.theme-light .ribbon .ribbon-content-wrapper {
    background-color: var(--ribbon-background-color)
}

.theme-light.ribbon .ribbon-content,.theme-light .ribbon .ribbon-content {
    color: var(--ribbon-text-color)
}

.theme-light.ribbon .ribbon-link:focus,.theme-light .ribbon .ribbon-link:focus {
    outline-color: var(--ribbon-focus-color)
}

.theme-light.ribbon .ribbon-link,.theme-light .ribbon .ribbon-link {
    color: var(--ribbon-link-color)
}

.theme-light.ribbon-blue,.theme-light .ribbon-blue {
    --ribbon-background-color: #0071e3;
    --ribbon-text-color: white;
    --ribbon-link-color: white;
    --ribbon-focus-color: rgba(255,255,255,0.6)
}

.theme-light.ribbon-blue .ribbon-content-wrapper,.theme-light .ribbon-blue .ribbon-content-wrapper {
    background-color: var(--ribbon-background-color)
}

.theme-light.ribbon-blue .ribbon-content,.theme-light .ribbon-blue .ribbon-content {
    color: var(--ribbon-text-color)
}

.theme-light.ribbon-blue .ribbon-link:focus,.theme-light .ribbon-blue .ribbon-link:focus {
    outline-color: var(--ribbon-focus-color)
}

.theme-light.ribbon-blue .ribbon-link,.theme-light .ribbon-blue .ribbon-link {
    color: var(--ribbon-link-color)
}

.theme-light.ribbon-blue-to-default,.theme-light .ribbon-blue-to-default {
    --ribbon-background-color: #f5f5f7;
    --ribbon-background-color-initial: #0071e3;
    --ribbon-text-color: #1d1d1f;
    --ribbon-text-color-initial: white;
    --ribbon-link-color: #0066cc;
    --ribbon-focus-color: rgba(0,125,250,0.6);
    --ribbon-link-color-initial: white
}

@keyframes animate-background-0071e3-f5f5f7 {
    0% {
        background-color: var(--ribbon-background-color-initial)
    }

    100% {
        background-color: var(--ribbon-background-color)
    }
}

.theme-light.ribbon-blue-to-default .ribbon-content-wrapper,.theme-light .ribbon-blue-to-default .ribbon-content-wrapper {
    background-color: var(--ribbon-background-color-initial);
    animation: animate-background-0071e3-f5f5f7 1s ease-in-out 1.8s forwards
}

@media(prefers-reduced-motion) {
    .theme-light.ribbon-blue-to-default .ribbon-content-wrapper,.theme-light .ribbon-blue-to-default .ribbon-content-wrapper {
        background-color: var(--ribbon-background-color);
        animation: none
    }
}

@keyframes animate-color-white-1d1d1f {
    0% {
        color: var(--ribbon-text-color-initial)
    }

    100% {
        color: var(--ribbon-text-color)
    }
}

.theme-light.ribbon-blue-to-default .ribbon-content,.theme-light .ribbon-blue-to-default .ribbon-content {
    color: var(--ribbon-text-color-initial);
    animation: animate-color-white-1d1d1f 1s ease-in-out 1.8s forwards
}

@media(prefers-reduced-motion) {
    .theme-light.ribbon-blue-to-default .ribbon-content,.theme-light .ribbon-blue-to-default .ribbon-content {
        color: var(--ribbon-text-color);
        animation: none
    }
}

.theme-light.ribbon-blue-to-default .ribbon-link:focus,.theme-light .ribbon-blue-to-default .ribbon-link:focus {
    outline-color: var(--ribbon-focus-color)
}

@keyframes animate-color-white-0066cc {
    0% {
        color: var(--ribbon-link-color-initial)
    }

    100% {
        color: var(--ribbon-link-color)
    }
}

.theme-light.ribbon-blue-to-default .ribbon-link,.theme-light .ribbon-blue-to-default .ribbon-link {
    color: var(--ribbon-link-color-initial);
    animation: animate-color-white-0066cc 1s ease-in-out 1.8s forwards
}

@media(prefers-reduced-motion) {
    .theme-light.ribbon-blue-to-default .ribbon-link,.theme-light .ribbon-blue-to-default .ribbon-link {
        color: var(--ribbon-link-color);
        animation: none
    }
}