/* RTL / Arabic overrides — load AFTER campaign.css on pages with . Fonts: Forma Text (body) + Forma Display (headings), same as the marketing site's /ar/ pages. */ @font-face { font-family: "Forma Display"; font-weight: 500; font-display: swap; src: url("/assets/fonts/Forma/FormaDJRArabicDisplay-Medium-Testing.otf") format("opentype"); } @font-face { font-family: "Forma Display"; font-weight: 700; font-display: swap; src: url("/assets/fonts/Forma/FormaDJRArabicDisplay-Bold-Testing.otf") format("opentype"); } @font-face { font-family: "Forma Display"; font-weight: 800; font-display: swap; src: url("/assets/fonts/Forma/FormaDJRArabicDisplay-Bold-Testing.otf") format("opentype"); } @font-face { font-family: "Forma Text"; font-weight: 400; font-display: swap; src: url("/assets/fonts/Forma/FormaDJRArabicText-Regular-Testing.otf") format("opentype"); } @font-face { font-family: "Forma Text"; font-weight: 500; font-display: swap; src: url("/assets/fonts/Forma/FormaDJRArabicText-Medium-Testing.otf") format("opentype"); } @font-face { font-family: "Forma Text"; font-weight: 600; font-display: swap; src: url("/assets/fonts/Forma/FormaDJRArabicText-Bold-Testing.otf") format("opentype"); } @font-face { font-family: "Forma Text"; font-weight: 700; font-display: swap; src: url("/assets/fonts/Forma/FormaDJRArabicText-Bold-Testing.otf") format("opentype"); } [dir="rtl"] { --font-text: "Forma Text", "Helvetica Neue", Tahoma, system-ui, sans-serif; --font-display: "Forma Display", "Forma Text", Tahoma, sans-serif; } /* ---- typography ---- */ [dir="rtl"] body { font-family: var(--font-text); line-height: 1.6; } [dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3 { font-family: var(--font-display); line-height: 1.22; letter-spacing: 0; } [dir="rtl"] .h2 { font-size: clamp(1.9rem, 3.4vw, 2.8rem); } [dir="rtl"] .eyebrow { letter-spacing: 0; text-transform: none; font-size: .86rem; } [dir="rtl"] .lead { font-size: 1.15rem; line-height: 1.75; } [dir="rtl"] .btn { font-size: 1.02rem; } [dir="rtl"] .btn svg { transform: scaleX(-1); } [dir="rtl"] .ltr { direction: ltr; unicode-bidi: isolate; font-family: "Duplet Open", var(--font-text); } [dir="rtl"] .num { font-variant-numeric: tabular-nums; unicode-bidi: isolate; direction: ltr; display: inline-block; } /* ---- header / progress ---- */ [dir="rtl"] .progress { left: auto; right: 0; background: linear-gradient(270deg, var(--lime), var(--mint), var(--cyan)); } [dir="rtl"] .hdr__nav { font-size: .95rem; } [dir="rtl"] .hdr__lang { font-family: "Duplet Open", sans-serif; } /* ---- hero ---- */ [dir="rtl"] .hero__bg img { animation-name: kenburns-rtl; } @keyframes kenburns-rtl { from { transform: scale(1.04) translate(0,0); } to { transform: scale(1.18) translate(2%, -2%); } } [dir="rtl"] .hero__bg::after { background: linear-gradient(270deg, rgba(6,10,36,.96) 0%, rgba(6,10,36,.86) 40%, rgba(0,18,119,.55) 100%), linear-gradient(180deg, rgba(6,10,36,.7) 0%, transparent 30%, rgba(6,10,36,.9) 100%); } [dir="rtl"] .shader__aurora span:nth-child(1) { left: auto; right: 8%; } [dir="rtl"] .shader__aurora span:nth-child(2) { right: auto; left: 4%; } [dir="rtl"] .shader__aurora span:nth-child(3) { left: auto; right: 48%; } [dir="rtl"] .hero__plate { padding: 8px 8px 8px 14px; } [dir="rtl"] .hero__plate small { letter-spacing: 0; text-transform: none; font-size: .78rem; } [dir="rtl"] .hero h1 { font-size: clamp(2.2rem, 4.6vw, 3.9rem); } [dir="rtl"] .hero h1 .w { transform: translateY(24px); } [dir="rtl"] .hero h1 em { font-style: normal; } [dir="rtl"] .hero__sub { font-size: 1.18rem; line-height: 1.75; } [dir="rtl"] .play small { font-size: .84rem; } [dir="rtl"] .stat__v { font-family: var(--font-display); font-size: 2rem; letter-spacing: 0; line-height: 1.1; } [dir="rtl"] .stat__l { font-size: .86rem; line-height: 1.45; } [dir="rtl"] .scrollcue { letter-spacing: 0; text-transform: none; font-size: .74rem; } /* ---- form card ---- */ [dir="rtl"] .form-card::before { background: linear-gradient(220deg, rgba(143,255,153,.7), transparent 40%, transparent 60%, rgba(3,254,249,.5)); } [dir="rtl"] .form-card__badge { left: auto; right: 26px; letter-spacing: 0; text-transform: none; font-size: .8rem; } [dir="rtl"] .f label { font-size: .86rem; } [dir="rtl"] .f input[type="email"], [dir="rtl"] .f input[type="tel"] { direction: ltr; text-align: right; } [dir="rtl"] .trust-row .faces img { margin-left: 0; margin-right: -8px; } [dir="rtl"] .trust-row .faces img:first-child { margin-right: 0; } /* ---- marquees keep LTR motion; captions stay RTL ---- */ [dir="rtl"] .logos__lbl { letter-spacing: 0; text-transform: none; font-size: .82rem; } [dir="rtl"] .logos__track, [dir="rtl"] .marquee { direction: ltr; } [dir="rtl"] .gal span { direction: rtl; text-align: right; font-size: .88rem; } /* ---- stakes ---- */ [dir="rtl"] .stakes__bg::after { background: radial-gradient(ellipse 60% 70% at 70% 50%, transparent, var(--dark-2) 90%); } [dir="rtl"] .stakes__num { font-family: var(--font-display); font-size: clamp(4rem, 9.5vw, 7.5rem); letter-spacing: 0; line-height: 1; white-space: nowrap; } [dir="rtl"] .stakes__num small { font-family: var(--font-text); letter-spacing: 0; text-transform: none; font-size: 1.05rem; } [dir="rtl"] .stakes__body p { font-size: 1.18rem; line-height: 1.8; } /* ---- compare: fills anchor right, milestones use `right:` ---- */ [dir="rtl"] .track__tag { letter-spacing: 0; text-transform: none; font-size: .84rem; } [dir="rtl"] .track__days { font-family: var(--font-display); letter-spacing: 0; font-size: 1.9rem; } [dir="rtl"] .track__fill { inset: 0 0 0 auto; background: linear-gradient(270deg, #C9CDDD, #9CA3B5); } [dir="rtl"] .track--after .track__fill { background: linear-gradient(270deg, var(--lime), var(--mint)); } [dir="rtl"] .track__ms { height: 38px; } [dir="rtl"] .track__ms span { transform: translateX(50%); font-size: .8rem; } [dir="rtl"] .track__ms span:first-child { transform: none; } [dir="rtl"] .track__ms span:last-child { transform: translateX(100%); } /* ---- product mockup ---- */ [dir="rtl"] .mock__chrome { direction: ltr; } [dir="rtl"] .mock__nav { border-right: 0; border-left: 1px solid rgba(29,30,231,.06); } [dir="rtl"] .mock__title small, [dir="rtl"] .mock__kpi small, [dir="rtl"] .mock__row--h { letter-spacing: 0; text-transform: none; font-size: .78rem; } [dir="rtl"] .mock__title h3 { letter-spacing: 0; } [dir="rtl"] .mock__pill { font-size: .8rem; } [dir="rtl"] .mock__row { font-size: .9rem; } [dir="rtl"] .bid.win::before { margin-right: 0; margin-left: 6px; } [dir="rtl"] .mock__lock, [dir="rtl"] .mock__btn { font-size: .86rem; } /* ---- bento / carousel / steps ---- */ [dir="rtl"] .bcard__v { font-family: var(--font-display); font-size: clamp(2.2rem, 3.8vw, 3.2rem); letter-spacing: 0; line-height: 1.1; } [dir="rtl"] .bcard p { line-height: 1.65; } [dir="rtl"] .voices { background: linear-gradient(225deg, var(--dark) 0%, #0A1235 60%, #0F1A52 100%); } [dir="rtl"] .car__text { font-size: clamp(1.15rem, 1.9vw, 1.5rem); line-height: 1.7; letter-spacing: 0; } [dir="rtl"] .car__dots button.on::after { transform-origin: right; } [dir="rtl"] .steps__line i { margin-left: auto; margin-right: 0; background: linear-gradient(270deg, var(--brand-blue), var(--brand-green)); } [dir="rtl"] .step__n { font-family: "Duplet Open", sans-serif; } [dir="rtl"] .step__card p, [dir="rtl"] .faq details p, [dir="rtl"] .investors { line-height: 1.7; } /* ---- cta / modals ---- */ [dir="rtl"] .cta h2 em { font-style: normal; } [dir="rtl"] .vmodal__x { right: auto; left: 24px; }