/* Arabic type roles: keep connected letters intact and use native letterforms. */
:root{--font-ar-display:'Alexandria',Arial,sans-serif;--font-ar-body:'IBM Plex Sans Arabic','Manrope',Arial,sans-serif;--font-ar-accent:'Aref Ruqaa',serif}
.arabic-type,.marketing-site [lang=ar]{font-family:var(--font-ar-body);letter-spacing:normal;word-spacing:normal;font-synthesis:none}
.arabic-type{line-height:1.75;text-align:start}
.arabic-type :is(p,li,button,input,textarea,select){font:inherit;letter-spacing:normal}
.arabic-type :is(h1,h2,h3),.ar-display:lang(ar){font-family:var(--font-ar-display);font-weight:700;font-style:normal;line-height:1.5;letter-spacing:normal}
.arabic-type .ar-accent,.ar-accent:lang(ar){font-family:var(--font-ar-accent);font-weight:700;font-style:normal;line-height:1.7;letter-spacing:normal}
.arabic-type :is(strong,b){font-weight:600}
.arabic-type :is(bdi[dir=ltr],[lang=en]){font-family:'Manrope',Arial,sans-serif;unicode-bidi:isolate}
.demo-chat[lang=ar]{font-family:var(--font-ar-body);font-size:16px;line-height:1.7;letter-spacing:normal}
.demo-chat[lang=ar] :is(.chat-top,.chat-label){font-family:var(--font-ar-display);font-size:15px;font-weight:600;line-height:1.7}
.demo-chat .chat-top .chat-label{font-size:inherit;margin:0}
.demo-chat .chat-brand{font-family:'Manrope',Arial,sans-serif;unicode-bidi:isolate}
.demo-chat[lang=ar] :is(.chat-message,.demo-choices button){font-family:var(--font-ar-body);font-size:16px;line-height:1.7;letter-spacing:normal}
.demo-chat[lang=ar] .demo-choices button{font-weight:500}
.demo-section .demo-status[lang=ar]{font-family:var(--font-ar-body);font-size:14px;line-height:1.8;text-align:start;letter-spacing:normal}
.demo-chat[dir=rtl] .chat-message.incoming{margin-inline-start:0;margin-inline-end:auto}
.demo-chat[dir=rtl] .chat-message.outgoing{margin-inline-start:auto;margin-inline-end:0}
@media(max-width:767px){.demo-chat[lang=ar],.demo-chat[lang=ar] :is(.chat-message,.demo-choices button){font-size:15px}}

/* Arabic edition: native joining, roomy line boxes and logical reading order. */
html[lang=ar] .marketing-site{font-family:var(--font-ar-body);font-synthesis:none;letter-spacing:normal;word-spacing:normal;line-height:1.7}
html[lang=ar] .marketing-site :is(h1,h2,h3){font-family:var(--font-ar-display);font-weight:600;line-height:1.35;letter-spacing:normal;word-spacing:normal}
html[lang=ar] .marketing-site :is(h1,h2,h3) em{font-family:var(--font-ar-accent);font-style:normal;font-weight:700;letter-spacing:normal;line-height:1.55}
html[lang=ar] .marketing-site :is(p,li,summary,dt,dd,label,button,input,textarea,select){letter-spacing:normal;word-spacing:normal;line-height:1.7}
html[lang=ar] .marketing-site :is(button,input,textarea,select){font-family:var(--font-ar-body)}
html[lang=ar] .marketing-site :is(.hb-label,.eyebrow,.article-meta,.article-byline,.hb-latest-mini small,.hb-hero-subtitle,.concept-label,.footer-legal,.mono){font-family:var(--font-ar-body);letter-spacing:normal;line-height:1.7}
html[lang=ar] .marketing-site :is(.hb-label,.eyebrow,.article-meta,.article-byline){font-size:12px}
html[lang=ar] .marketing-site :is(.button,.hb-small-link,.plain-link,.read-link,.hb-hero-action){font-size:16px;line-height:1.5}
html[lang=ar] .marketing-site .hb-wordmark{font-family:'BEIZ Integral',Manrope,Arial,sans-serif;font-weight:700;line-height:1;letter-spacing:-.015em}
html[lang=ar] :is(.mk-logo,.hb-wordmark,.mk-languages,.demo-lang){direction:ltr;unicode-bidi:isolate}
html[lang=ar] :is(.mk-logo,.mk-logo small,.hb-wordmark>span,.hb-wordmark i){line-height:inherit}
html[lang=ar] .mk-languages{font-family:'IBM Plex Mono',monospace;flex-shrink:0}
html[lang=ar] .mk-header nav{margin-left:0;margin-inline-start:auto;font-size:15px}
html[lang=ar] .mk-header .button{font-size:14px}
html[lang=ar] .hb-hero-subtitle{font-size:18px;line-height:1.6}
html[lang=ar] .hb-latest-mini strong{font-family:var(--font-ar-body);line-height:1.5;letter-spacing:normal}
html[lang=ar] .hb-latest-mini small{font-size:11px}
html[lang=ar] .hb-intro-copy{margin-inline-start:7%;margin-inline-end:auto}
html[lang=ar] .hb-service-poster{height:clamp(450px,38vw,700px)}
html[lang=ar] .hb-service-poster h2>*{letter-spacing:normal;line-height:1.45}
html[lang=ar] .marketing-site .hb-poster-top{left:auto;right:29%;top:0;font-size:clamp(90px,11vw,210px)}
html[lang=ar] .marketing-site .hb-poster-outline{left:auto;right:3%;top:105px;font-size:clamp(85px,10vw,190px);font-family:var(--font-ar-accent)}
html[lang=ar] .marketing-site .hb-poster-bottom{left:auto;right:61%;top:235px;font-size:clamp(95px,11vw,210px)}
html[lang=ar] .hb-service-poster>p{right:auto;left:24px;max-width:215px;font-size:17px}
/* Arabic service names read as complete phrases; reserve two lines per desktop row. */
html[lang=ar] .hb-service-table a{font-size:clamp(18px,1.3vw,22px);line-height:1.6;padding-block:12px;min-block-size:calc(3.2em + 24px);text-transform:none;text-align:start;direction:rtl;gap:12px}
html[lang=ar] .hb-service-table a>span{flex:none;font-size:18px;line-height:1;direction:ltr;unicode-bidi:isolate}
html[lang=ar] .hb-service-table a:focus-visible>span{opacity:1}
html[lang=ar] .hb-dot-tip{left:auto;right:25px;text-align:start;transform-origin:right bottom}
html[lang=ar] .hb-dot-tip strong{font-family:var(--font-ar-display);font-size:24px;line-height:1.5;letter-spacing:normal}
html[lang=ar] .hb-dot-tip>span{line-height:1.7}
html[lang=ar] .hb-feature h3{font-size:clamp(30px,4vw,74px);letter-spacing:normal}
html[lang=ar] .hb-feature:hover h3,html[lang=ar] .hb-feature:focus-visible h3{letter-spacing:normal}
html[lang=ar] .hb-featured-title h2>span{text-align:right;margin-left:0;margin-right:8%;transform:none}
html[lang=ar] .hb-featured-title h2>em{text-align:left;margin-right:0;margin-left:6%}
html[lang=ar] .hb-featured-open{right:auto;left:20px}
html[lang=ar] .hb-featured-media{margin-top:10px}
html[lang=ar] .hb-manifesto-steps{text-align:start}
html[lang=ar] .hb-manifesto-steps article:nth-child(2){text-align:center}
html[lang=ar] .hb-manifesto-steps article:nth-child(3){text-align:end}
html[lang=ar] .hb-manifesto-email{display:inline-block;font-family:Manrope,Arial,sans-serif;direction:ltr;unicode-bidi:isolate}

html[lang=ar] .hb-footer-contacts>a:nth-child(2){transform:translateX(-8%)}
html[lang=ar] .hb-footer-contacts>a:nth-child(3){transform:translateX(-16%)}
html[lang=ar] :is(.hb-footer-contacts,.brief-direct) a{direction:ltr;unicode-bidi:isolate}
html[lang=ar] :is(a[href^='mailto:'],a[href^='tel:']){unicode-bidi:plaintext}
html[lang=ar] .footer-legal span{margin-left:auto;margin-right:0}
html[lang=ar] .prose{font-size:20px;line-height:1.9}
html[lang=ar] .prose :is(ul,ol){padding-left:0;padding-right:1.4em}
html[lang=ar] .prose :is(li,p){line-height:1.9}
html[lang=ar] .prose h2{font-size:clamp(25px,2.6vw,36px);line-height:1.6}
html[lang=ar] .prose h3{font-size:24px}
html[lang=ar] :is(.fit-section,.includes-section,.case-includes) li{padding-inline-start:0}
html[lang=ar] :is(.breadcrumbs,.article-toc nav,.filters,.journal-search,.brief-form){font-size:16px}
html[lang=ar] .breadcrumbs{flex-wrap:wrap;line-height:1.6}
html[lang=ar] :is(.brief-form .form-label,.brief-form legend){font-size:18px}
html[lang=ar] .brief-form .form-help{font-size:15px}
html[lang=ar] .brief-form .form-result p{font-size:17px;line-height:1.8}
html[lang=ar] .brief-form .whatsapp-draft{font-size:17px;line-height:1.6}
html[lang=ar] .whatsapp-draft svg{transform:scaleX(-1)}
html[lang=ar] .brief-form .brief-choice span{font-size:15px}
html[lang=ar] .brief-form :is(input[type=text],textarea,select){text-align:start;font-size:18px}
html[lang=ar] .journal-search input{font-family:var(--font-ar-body);text-align:start}
html[lang=ar] #menu-dialog .menu-inside nav a{font-family:var(--font-ar-display);line-height:1.6;letter-spacing:normal}
html[lang=ar] #menu-dialog .menu-inside h2{font-family:var(--font-ar-body);font-size:clamp(20px,2vw,30px);font-weight:400;line-height:1.7;letter-spacing:normal}
html[lang=ar] :is(#menu-dialog,#preview-dialog){font-family:var(--font-ar-body);letter-spacing:normal}
html[lang=ar] #menu-dialog .close-dialog{font-family:var(--font-ar-body);font-size:15px}
html[lang=ar] #preview-dialog :is(.eyebrow,.hb-label,dt,figcaption){font-family:var(--font-ar-body);font-size:14px;line-height:1.7;letter-spacing:normal}
html[lang=ar] #preview-dialog .hb-popup-story ul{font-size:14px;line-height:1.7}
html[lang=ar] #preview-dialog .hb-popup-story h2.preview-heading{font-family:var(--font-ar-display);line-height:1.45;letter-spacing:normal}
html[lang=ar] :is(.hb-popup-story,.hb-popup-images){min-width:0}
html[lang=ar] .preview-bar .eyebrow{margin-left:0;margin-inline-start:auto}
html[lang=ar] .close-dialog{flex-shrink:0}
html[lang=ar] :is(.mock-title,.ai-art-copy strong,.campaign-label strong){font-family:var(--font-ar-display);font-weight:600;font-style:normal;line-height:1.35;letter-spacing:normal}
html[lang=ar] .mock-title i{font-family:var(--font-ar-accent);font-style:normal;line-height:1.5}
html[lang=ar] .mock-nav{gap:10px}
html[lang=ar] .mock-nav b{font-family:Georgia,serif;direction:ltr}
html[lang=ar] .chat-message{letter-spacing:normal;line-height:1.6}
html[lang=ar] .chat-message.outgoing{margin-left:0;margin-right:auto;color:var(--on-brand)}
html[lang=ar] .chat-message.incoming{margin-left:auto;margin-right:0}
@media(max-width:1024px){
 html[lang=ar] .marketing-site .hb-wordmark{line-height:.96}
 html[lang=ar] .hb-service-table{grid-template-columns:repeat(2,minmax(0,1fr))}
 html[lang=ar] .hb-service-poster>p{font-size:15px;max-width:175px}
}
@media(max-width:950px){html[lang=ar] .mk-header>.button{margin-left:0;margin-inline-start:auto}}
@media(max-width:767px){
 html[lang=ar] .mk-header{gap:6px}
 html[lang=ar] .mk-header>.button{font-size:13px;padding-inline:10px;gap:8px}
 html[lang=ar] .marketing-site :is(.index-hero,.detail-hero) h1{font-size:clamp(32px,8.8vw,54px);line-height:1.45}
 html[lang=ar] .marketing-site .detail-hero-posts h1{font-size:clamp(30px,8.2vw,48px)}
 html[lang=ar] .marketing-site .brief-intro h1{font-size:16vw;line-height:1.35}
 html[lang=ar] .marketing-site .hb-intro h2{font-size:10vw;line-height:1.5}
 html[lang=ar] .hb-hero-subtitle{font-size:16px;line-height:1.6}
 html[lang=ar] .hb-hero-action{font-size:15px}
 html[lang=ar] .hb-scroll{right:auto;left:0}
 html[lang=ar] .hb-intro-copy{width:100%;margin:40px 0 0}
 html[lang=ar] .hb-service-poster{height:400px}
 html[lang=ar] .marketing-site .hb-poster-top{font-size:19vw;right:23%;top:0}
 html[lang=ar] .marketing-site .hb-poster-outline{font-size:20vw;right:4%;top:95px}
 html[lang=ar] .marketing-site .hb-poster-bottom{font-size:19vw;right:40%;top:180px}
 html[lang=ar] .hb-service-poster>p{left:auto;right:16px;top:290px;max-width:none}
 html[lang=ar] .hb-service-table{grid-template-columns:1fr}
 html[lang=ar] .hb-service-table a{font-size:18px;min-block-size:64px}
 html[lang=ar] .hb-feature{grid-template-columns:22px minmax(0,1fr) 30px;gap:12px}
 html[lang=ar] .hb-feature h3{font-size:clamp(23px,6.1vw,38px)}
 html[lang=ar] .hb-featured-title h2>span{margin-right:5%}
 html[lang=ar] .hb-featured-title h2>em{margin-left:5%}
 html[lang=ar] .hb-featured-open{left:12px;font-size:12px}
 html[lang=ar] .hb-featured-meta>span:last-child{text-align:end}
 html[lang=ar] .marketing-site :is(.hb-work,.hb-journal,.hb-faq) h2{font-size:10vw}
 html[lang=ar] .marketing-site .hb-manifesto h2{font-size:11vw}
 html[lang=ar] .hb-manifesto-steps article:nth-child(n){text-align:start}
 html[lang=ar] .hb-studio-title>p{margin:25px 35% 0 0}
 html[lang=ar] .prose{font-size:18px}
 html[lang=ar] .marketing-site .mk-service-row h3{font-size:26px}
 html[lang=ar] .hb-footer-nav{font-size:14px;gap:12px 24px}
 html[lang=ar] .footer-legal span{margin:0}
 html[lang=ar] .footer-legal>:nth-child(even){text-align:start}
 html[lang=ar] .hb-case-grid .ai-art-copy strong{font-size:29px}
 html[lang=ar] .hb-popup-images .ai-art-copy strong{font-size:26px}
 html[lang=ar] #preview-dialog .hb-popup-story h2.preview-heading{font-size:30px!important;line-height:1.5}
}
html[lang=ar] .hb-popup-story dt{font-size:14px}
html[lang=ar] .hb-popup-story dd{font-size:17px}
html[lang=ar] :is(.button,.plain-link,.read-link,.row-arrow) svg{transform:scaleX(-1)}
@media(min-width:768px){
 html[lang=ar] .hb-footer-contacts>a:nth-child(n){transform:none;direction:rtl}
}