html[lang=ar] body {
    font-family: Tahoma, "Segoe UI", Arial, sans-serif
}

html[lang=ar] h1,
html[lang=ar] h2,
html[lang=ar] h3,
html[lang=ar] .eyebrow {
    letter-spacing: 0 !important
}

html[lang=ar] h1 {
    line-height: 1.2
}

html[lang=ar] h2,
html[lang=ar] h3 {
    line-height: 1.4
}

html[lang=ar] .eyebrow {
    text-transform: none;
    line-height: 1.7
}

html[lang=ar] p {
    line-height: 1.9
}

html[lang=ar] .reference-hero h1,
html[lang=ar] .reference-ordering-hero h1,
html[lang=ar] .epos-aligned-hero h1 {
    font-size: clamp(39px, 3.6vw, 53px)
}
html[dir=rtl] .dropdown-menu {
    left: auto;
    right: -18px
}

html[dir=rtl] .hero-cutout {
    margin-right: 0;
    margin-left: -18px
}

html[dir=rtl] .button .icon-svg[data-icon=arrow],
html[dir=rtl] .text-link .icon-svg[data-icon=arrow],
html[dir=rtl] .round-arrow .icon-svg {
    transform: rotate(180deg)
}

html[dir=rtl] .hero-category-controls>a {
    margin-left: 0;
    margin-right: 3px
}

html[dir=rtl] .journey-number {
    left: auto;
    right: 17px
}

html[dir=rtl] .ownership-banner-art {
    margin-right: 0;
    margin-left: -45px
}

html[dir=rtl] .cta-cutout {
    margin-right: 0;
    margin-left: -25px
}

html[dir=rtl] .growth-cutout {
    right: auto;
    left: 10%
}

html[dir=rtl] .ecosystem-node,
html[dir=rtl] .ecosystem-centre {
    direction: rtl
}

html[dir=rtl] .hardware-art>img {
    left: auto;
    right: -30%
}

html[dir=rtl] .launch-price,
html[dir=rtl] .plan-rate,
html[dir=rtl] .hardware-price {
    direction: ltr;
    text-align: start
}

html[dir=rtl] .launch-price>small {
    direction: rtl;
    text-align: right
}

html[dir=rtl] .plan-rate {
    justify-content: flex-end
}

html[dir=rtl] .hardware-price {
    justify-content: flex-end
}

html[dir=rtl] .launch-price {
    margin-left: auto
}

html[dir=rtl] .flow-number {
    align-self: flex-start
}

html[dir=rtl] .flow-track span {
    margin-left: auto
}

html[dir=rtl] .flow-track span::after {
    left: auto;
    right: var(--flow-end, 25%)
}

html[dir=rtl] .carousel-controls>button:first-child .icon-svg {
    transform: none
}

html[dir=rtl] .carousel-controls>button:last-child .icon-svg {
    transform: rotate(180deg)
}

html[dir=rtl] .payment-methods,
html[dir=rtl] .innovation-partners {
    direction: ltr
}

html[dir=rtl] .social-links {
    direction: ltr;
    justify-content: flex-end
}

html[dir=rtl] .check-list {
    padding-right: 0
}

html[dir=rtl] .detail-copy {
    text-align: right
}

html[dir=rtl] .footer-bottom>div {
    justify-content: flex-start
}

html[lang=ar] .illustrated-points li>span {
    line-height: 1.75
}

html[lang=ar] .hero-category-controls .category-chip {
    font-size: 10px
}

html[lang=ar] .flow-step b {
    font-size: 15px
}

html[lang=ar] .visual-pos-plan .illustrated-points li>span {
    font-size: 11px
}

@media(max-width:760px) {

    html[dir=rtl] .hero-cutout,
    html[dir=rtl] .ownership-banner-art,
    html[dir=rtl] .cta-cutout {
        margin-inline: auto
    }

    html[lang=ar] .reference-hero h1,
    html[lang=ar] .reference-ordering-hero h1,
    html[lang=ar] .epos-aligned-hero h1 {
        font-size: 46px
    }
}

@media(max-width:480px) {

    html[lang=ar] .reference-hero h1,
    html[lang=ar] .reference-ordering-hero h1,
    html[lang=ar] .epos-aligned-hero h1 {
        font-size: 37px
    }

    html[lang=ar] .hero-kicker {
        font-size: 8px
    }

    html[lang=ar] .hero-promise {
        font-size: 12px
    }

    html[lang=ar] .hero-description {
        font-size: 13px
    }

    html[lang=ar] .story-copy h2 {
        font-size: 28px
    }

    html[lang=ar] .story-copy h3 {
        font-size: 26px
    }

    html[lang=ar] .section-heading.centered h2 {
        font-size: 26px
    }

    html[lang=ar] .hero-copy .button {
        font-size: 10px;
        padding-inline: 13px
    }

    html[lang=ar] .flow-step b {
        font-size: 12px
    }

    html[lang=ar] .flow-caption {
        font-size: 10px
    }

    html[dir=rtl] .journey-number {
        right: 10px
    }

    html[dir=rtl] .growth-cutout {
        left: 20%
    }

    html[dir=rtl] .hardware-art>img {
        right: -35%
    }

    html[lang=ar] .experience-cta h2 {
        font-size: 27px
    }

    html[lang=ar] .experience-cta .button {
        font-size: 9px
    }

    html[lang=ar] .nav-actions .button {
        font-size: 9px
    }

    html[lang=ar] .feature-strip>a {
        font-size: 8px
    }
}

@media(max-width:360px) {

    html[lang=ar] .reference-hero h1,
    html[lang=ar] .reference-ordering-hero h1,
    html[lang=ar] .epos-aligned-hero h1 {
        font-size: 33px
    }

    html[lang=ar] .section-heading.centered h2 {
        font-size: 24px
    }

    html[lang=ar] .hero-copy .button {
        font-size: 9px;
        padding-inline: 11px
    }

    html[lang=ar] .managed-visual-card h3 {
        font-size: 12px
    }

    html[lang=ar] .feature-strip>a {
        font-size: 7px
    }
}

html[dir=rtl] .hardware-art>img {
    right: auto;
    left: auto
}