/*
 * Script typography and direction for the three translated editions.
 * Load after site.css and assets-browser.css. The language switcher should set
 * <html lang="…" dir="…">; :lang() also matches ar-*, zh-CN/zh-Hans and ru-*.
 * All selectors are language-scoped, so the original English design is intact.
 */
html:lang(ar) {
  --language-body-font: "Noto Sans Arabic", "Geeza Pro", Tahoma, Arial, sans-serif;
  --language-display-font: "Noto Naskh Arabic", "Geeza Pro", "Traditional Arabic", serif;
  direction: rtl;
}

html:lang(zh) {
  --language-body-font: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  --language-display-font: "Noto Serif SC", "Songti SC", STSong, SimSun, serif;
  direction: ltr;
}

html:lang(ru) {
  --language-body-font: "Inter Cyrillic", Inter, "Segoe UI", Arial, sans-serif;
  --language-display-font: "Noto Serif", "PT Serif", Georgia, serif;
  direction: ltr;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) body {
  font-family: var(--language-body-font);
  font-synthesis: none;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) :is(h1, h2, h3, .mobile-links a, .question-list li, .capability-question, .landscape-fallback) {
  font-family: var(--language-display-font);
  overflow-wrap: anywhere;
  word-break: normal;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) :is(button, input, textarea, select) {
  font-family: var(--language-body-font);
}

/* Newsreader remains the personal identity and the original property typeface. */
html:is(:lang(ar), :lang(zh), :lang(ru)) .wordmark {
  font-family: Newsreader, Georgia, serif;
  font-synthesis: none;
  direction: ltr;
  unicode-bidi: isolate;
  letter-spacing: -.035em;
  flex-shrink: 0;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) :is(.asset-caption h3, .asset-placeholder-title) {
  font-family: Newsreader, Georgia, serif;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) :is(.asset-location, .asset-facts dd, .asset-provenance a, input[type="email"], input[type="tel"], input[type="url"]) {
  font-family: Inter, Arial, sans-serif;
}

/* Translation may expand text; let the existing components grow and wrap. */
html:is(:lang(ar), :lang(zh), :lang(ru)) :is(.header-inner, .desktop-nav, .mobile-top, .footer-top, .footer-links, .capability, .asset-filter, .contact-intro, .contact-form-wrap) {
  min-inline-size: 0;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) :is(.hero h1, .hero h1 em, .headline-line) {
  max-inline-size: 100%;
  white-space: normal;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) .hero h1 {
  margin-inline: auto;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) .hero-lead {
  max-inline-size: 46rem;
  margin-inline: auto;
  line-height: 1.65;
  letter-spacing: normal;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) .desktop-nav {
  gap: clamp(16px, 1.6vw, 26px);
  font-size: .8125rem;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) .desktop-nav a {
  min-inline-size: 0;
  max-inline-size: 22ch;
  white-space: normal;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) .mobile-links a {
  font-size: clamp(1.65rem, 6.8vw, 2.6rem);
  line-height: 1.4;
  max-inline-size: 100%;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) :is(.button, .text-link, .asset-original, .asset-discuss, .service-more) {
  max-inline-size: 100%;
  min-inline-size: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: start;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) :is(.button, .text-link) {
  gap: 20px;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) .arrow {
  flex-shrink: 0;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) :is(.label, .hero-eyebrow, .asset-category, .asset-placeholder-label) {
  text-transform: none;
  font-size: .75rem;
  line-height: 1.8;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) :is(.asset-category, .asset-results-bar, .assets-collection-heading, .footer-bottom) {
  flex-wrap: wrap;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) .asset-status {
  max-inline-size: 100%;
  white-space: normal;
  text-align: end;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) :is(.asset-apply, .asset-reset) {
  max-inline-size: 100%;
  white-space: normal;
  text-align: start;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) .footer-links {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-inline-size: 100%;
}

html:is(:lang(ar), :lang(zh), :lang(ru)) :is(.footer-links a, .footer-bottom span, .asset-pagination a) {
  min-inline-size: 0;
  overflow-wrap: anywhere;
}

/* Arabic and Chinese keep natural script spacing and upright emphasis. */
html:is(:lang(ar), :lang(zh)) :is(h1, h2, h3, .label, .hero-eyebrow, .hero h1 em, .mobile-links a, .question-list li, .capability-question, .capability-application .label, .asset-category, .asset-placeholder-label, .landscape figcaption) {
  letter-spacing: normal;
}

html:is(:lang(ar), :lang(zh)) :is(em, .capability-question) {
  font-style: normal;
}

html:lang(ar) body {
  line-height: 1.9;
}

html:lang(ar) :is(h1, h2, h3, .question-list li, .capability-question) {
  line-height: 1.4;
}

html:lang(ar) .hero h1 {
  font-size: clamp(2.65rem, 5.3vw, 5.4rem);
  line-height: 1.35;
}

html:lang(ar) :is(.prose, .service-row p, .proof-list p, .faq details > p, .capability-experience, .capability-application p, .process-body) {
  line-height: 1.95;
}

html:lang(zh) body {
  line-height: 1.85;
  line-break: strict;
}

html:lang(zh) :is(h1, h2, h3, .question-list li, .capability-question) {
  line-height: 1.45;
}

html:lang(zh) .hero h1 {
  font-size: clamp(2.4rem, 4.8vw, 4.9rem);
  line-height: 1.4;
}

html:lang(zh) :is(.prose, .service-row p, .proof-list p, .faq details > p, .capability-experience, .capability-application p, .process-body) {
  line-height: 1.9;
}

html:lang(ru) :is(h1, h2, h3, .mobile-links a, .question-list li, .capability-question) {
  letter-spacing: -.015em;
  hyphens: auto;
}

html:lang(ru) .hero h1 {
  font-size: clamp(2.7rem, 5.1vw, 5.3rem);
  line-height: 1.12;
}

html:lang(ru) :is(.label, .hero-eyebrow, .capability-application .label, .asset-category, .asset-placeholder-label) {
  letter-spacing: .045em;
}

/* RTL follows the source order through flex/grid; only physical LTR offsets move. */
html:lang(ar) .skip {
  left: auto;
  right: 20px;
}

html:lang(ar) .desktop-nav a::after {
  transform-origin: right;
}

html:lang(ar) .service-row {
  border-left: 0;
  border-right: 1px solid var(--rule);
  padding-inline: clamp(23px, 2.8vw, 40px);
}

html:lang(ar) .service-row:first-child {
  border-right: 0;
  padding-inline-start: 0;
}

html:lang(ar) .service-row:last-child {
  padding-inline-end: 0;
}

html:lang(ar) .process-body {
  padding-inline: 50px 20px;
}

html:lang(ar) .question-list li {
  padding-left: 0;
  padding-inline-start: 44px;
}

html:lang(ar) .question-list li::before {
  left: auto;
  right: 0;
  direction: ltr;
  unicode-bidi: isolate;
}

html:lang(ar) :is(.deliverables ul, .form-errors ul) {
  padding-left: 0;
  padding-inline-start: 20px;
  padding-inline-end: 0;
}

html:lang(ar) .deliverables li {
  padding-left: 0;
  padding-inline-start: 8px;
}

html:lang(ar) .capability-application {
  border-left: 0;
  border-right: 1px solid var(--copper);
  padding-left: 0;
  padding-inline-start: 20px;
}

html:lang(ar) select {
  padding-inline: 12px 28px;
}

html:lang(ar) .asset-filter :is(input, select) {
  padding-inline: 14px 36px;
}

html:lang(ar) .asset-search-control input {
  padding-inline: 44px 14px;
}

html:lang(ar) .field-bottom > span:last-child {
  margin-left: 0;
  margin-inline-start: auto;
}

html:lang(ar) :is(.assets-updated, .cta-action > a:last-child) {
  text-align: start;
}

html:lang(ar) .asset-placeholder-note > span {
  margin-left: 0;
  margin-inline-start: 10px;
}

html:lang(ar) .arrow {
  transform: scaleX(-1);
}

html:lang(ar) :is(.button:hover, .text-link:hover, .service-row:hover) .arrow {
  transform: translateX(-5px) scaleX(-1);
}

html:lang(ar) .asset-pagination > a > span {
  transform: scaleX(-1);
}

/* Original addresses, advertised values and contact identifiers stay readable. */
html:lang(ar) :is(.asset-caption h3, .asset-location, .asset-facts dd, .asset-placeholder-title, .asset-provenance a, .wordmark, .service-num, .proof-index, .step-num, #message-count, [data-bidi="ltr"], [data-ltr]) {
  direction: ltr;
  unicode-bidi: isolate;
}

html:lang(ar) :is(.asset-caption h3, .asset-location, .asset-facts dd) {
  text-align: right;
}

html:lang(ar) .asset-placeholder-title {
  text-align: center;
}

html:lang(ar) :is(a[href^="mailto:"]:not(.button), a[href^="tel:"], input[type="email"], input[type="tel"], input[type="url"]) {
  direction: ltr;
  unicode-bidi: isolate;
}

html:lang(ar) :is(input[type="email"], input[type="tel"], input[type="url"]) {
  text-align: left;
}

html:lang(ar) a[href^="mailto:"]:not(.button) .arrow {
  transform: none;
}

html:lang(ar) :is(input:not([type="email"]):not([type="tel"]):not([type="url"]), textarea, time) {
  unicode-bidi: plaintext;
}

/* Gallery keyboard/swipe indices follow physical left/right, independently of prose. */
html:lang(ar) .asset-gallery-controls {
  direction: ltr;
  unicode-bidi: isolate;
}

/* Longer translated navigation needs the existing menu before the English breakpoint. */
@media (max-width: 1279px) {
  html:is(:lang(ar), :lang(zh), :lang(ru)) .desktop-nav {
    display: none;
  }

  html:is(:lang(ar), :lang(zh), :lang(ru)) .menu-button {
    display: flex;
  }
}

@media (max-width: 767px) {
  html:is(:lang(ar), :lang(zh), :lang(ru)) :is(.hero-eyebrow, .hero-support) {
    max-inline-size: 100%;
  }

  html:is(:lang(ar), :lang(zh), :lang(ru)) .hero h1 {
    font-size: clamp(2rem, 8.8vw, 3.65rem);
  }

  html:is(:lang(ar), :lang(zh), :lang(ru)) :is(.page-hero h1, .contact-intro h1, .assets-intro h1) {
    font-size: clamp(2rem, 8.8vw, 3.3rem);
    max-inline-size: 100%;
  }

  html:is(:lang(ar), :lang(zh), :lang(ru)) .hero h1 em {
    font-size: 1em;
  }

  html:is(:lang(ar), :lang(zh), :lang(ru)) .footer-links {
    gap: 12px 24px;
  }

  html:lang(ar) :is(.service-row, .service-row:first-child, .service-row:last-child) {
    border-right: 0;
    padding-inline: 0;
  }

  html:lang(ar) .process-body {
    padding-inline: 38px 10px;
  }

  html:lang(ar) .question-list li {
    padding-inline-start: 36px;
  }

  html:lang(ar) .capability-application {
    padding-inline-start: 16px;
  }

  html:lang(ar) .landscape figcaption span:nth-child(2) {
    text-align: end;
  }
}

@media (max-width: 650px) {
  html:is(:lang(ar), :lang(zh), :lang(ru)) .asset-pagination {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    row-gap: 8px;
  }

  html:is(:lang(ar), :lang(zh), :lang(ru)) .asset-pagination > p {
    grid-column: 1 / -1;
    grid-row: 1;
    justify-self: center;
  }

  html:is(:lang(ar), :lang(zh), :lang(ru)) .asset-pagination > a {
    grid-row: 2;
    max-inline-size: 100%;
    gap: 8px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html:lang(ar) .arrow {
    transform: scaleX(-1) !important;
  }

  html:lang(ar) a[href^="mailto:"]:not(.button) .arrow {
    transform: none !important;
  }
}
