/* Typography, direction, and navigation shared by all localized marketing pages.
   Loaded by every page; the generated language folders load it as ../i18n.css. */
:root{--landing-body-font:Barlow,sans-serif;--landing-display-font:'Big Shoulders Display',sans-serif;--landing-mono-font:'IBM Plex Mono',monospace}
[style*="font-family:Barlow"],[style*="font-family: Barlow"]{font-family:var(--landing-body-font)!important}
[style*="Big Shoulders Display"],.twin-title,.features-title,.feature-title,.roles-title,.role-title,.deployment-title,.deployment-step-title,.demo-title,.demo-form-title{font-family:var(--landing-display-font)!important}
[style*="IBM Plex Mono"],.features-meta,.feature-number,.feature-map-legend,.roles-hint,.deployment-eyebrow{font-family:var(--landing-mono-font)!important}
[data-mnav]{box-sizing:border-box;flex-wrap:wrap;min-height:62px;height:auto!important;padding-top:10px!important;padding-bottom:10px!important}
[data-mnav-links]{align-items:center;flex-wrap:wrap;min-width:0;row-gap:10px}
[data-mnav-btns]{flex-wrap:wrap;justify-content:flex-end}
[data-mnav-btns] language-switcher{margin-inline-end:2px}
.feature-card,.role-card,.demo-panel,.deployment-panel{min-width:0}
.feature-copy,.role-copy,.demo-copy,.twin-copy{overflow-wrap:anywhere}
html:not([lang="en"]) .features-meta{max-width:40%;flex:none}
html:not([lang="en"]) .demo-form input,html:not([lang="en"]) .demo-form textarea{font-family:var(--landing-body-font)}
html:lang(ar){line-height:1.6}
html:lang(ar) [style*="letter-spacing"],html:lang(ar) .features-meta,html:lang(ar) .feature-number,html:lang(ar) .deployment-eyebrow{letter-spacing:0!important}
html:lang(ar) [style*="Big Shoulders Display"],html:lang(ar) .twin-title,html:lang(ar) .features-title,html:lang(ar) .feature-title,html:lang(ar) .roles-title,html:lang(ar) .role-title,html:lang(ar) .demo-title,html:lang(ar) .deployment-title{line-height:1.35!important}
html:lang(ar) .feature-arrow{display:inline-block;transform:scaleX(-1)}
html:lang(ar) .feature-card:hover .feature-arrow{transform:translateX(-3px) scaleX(-1)}
html:lang(ar) .feature-map-legend span::before{margin-right:0;margin-left:6px}
html:lang(ar) [style*="margin-left:auto"]{margin-left:0!important;margin-right:auto}
html:lang(ar) [style*="border-left:6px"]{border-left:0!important;border-right:6px solid #111110;padding-left:0!important;padding-right:22px}
html:lang(ar) [style*="border-left:6px solid #F59E0B"]{border-right-color:#F59E0B}
html:lang(ar) [style*="margin-right:6px"]{margin-right:0!important;margin-left:6px}
html:lang(ar) .features-meta{text-align:left}
html:lang(ar) .feature-preview{direction:ltr}
html:lang(ja) [style*="Big Shoulders Display"],html:lang(th) [style*="Big Shoulders Display"]{line-height:1.2!important}
/* Arabic, Japanese and Thai carry taller glyphs (and Arabic adds diacritics above
   the cap line), so the oversized hero type is stepped down to keep consecutive
   lines from colliding. Latin locales keep the original display sizes. */
html:lang(ar) [data-mxl],html:lang(th) [data-mxl]{font-size:clamp(38px,6.4vw,84px)!important;line-height:1.45!important}
html:lang(ja) [data-mxl]{font-size:clamp(38px,6.8vw,92px)!important;line-height:1.3!important}
html:lang(ar) [data-mlg],html:lang(th) [data-mlg]{font-size:clamp(26px,3.8vw,46px)!important;line-height:1.45!important}
html:lang(ja) [data-mlg]{font-size:clamp(26px,4vw,52px)!important;line-height:1.3!important}
html:lang(ar) .twin-title,html:lang(ar) .features-title,html:lang(ar) .roles-title,html:lang(ar) .deployment-title,html:lang(ar) .demo-title,
html:lang(th) .twin-title,html:lang(th) .features-title,html:lang(th) .roles-title,html:lang(th) .deployment-title,html:lang(th) .demo-title{line-height:1.45!important}
@media(max-width:1100px){
  html:not([lang="en"]) [data-mnav-links]{order:3;width:100%;justify-content:center}
}
@media(max-width:767px){
  html:not([lang="en"]) .features-meta{max-width:none;text-align:start}
  [data-mnav-links]{justify-content:flex-start!important}
  html:lang(ar) [data-mxl],html:lang(ja) [data-mxl],html:lang(th) [data-mxl]{font-size:11.5vw!important}
  html:lang(ar) .feature-card .feature-title{font-size:18px}
  html:not([lang="en"]) .roles-grid{scroll-snap-type:x proximity}
}
@media(prefers-reduced-motion:reduce){html:lang(ar) .feature-card:hover .feature-arrow{transform:scaleX(-1)}}