@font-face {
  font-family: "Cairo";
  font-style: oblique 0deg 11deg;
  font-weight: 200 1000;
  font-display: swap;
  src: url("assets/fonts/cairo-variable.ttf") format("truetype-variations");
}

/* Language navigation shared by every page. */
.nav-dropdown--language summary {
  gap: 0.32rem;
  letter-spacing: 0.08em;
}

.nav-dropdown--language summary svg:first-child {
  width: 1rem;
  height: 1rem;
}

.nav-dropdown--language .nav-dropdown__menu {
  min-width: 11.5rem;
}

.nav-dropdown--language .nav-dropdown__menu a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.nav-dropdown--language .nav-dropdown__menu a::after {
  color: var(--gold);
  content: attr(data-code);
  font-size: 0.67rem;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.language-switcher summary {
  display: grid;
  place-items: center;
  width: 2.55rem;
  height: 2.55rem;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.34);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.055);
  transition: color 250ms ease, border-color 250ms ease, background 250ms ease;
}

.language-switcher summary:hover,
.language-switcher[open] summary {
  color: var(--gold-bright);
  border-color: var(--gold-bright);
  background: rgba(223, 182, 95, 0.1);
}

.language-switcher summary svg,
.language-switcher[open] summary svg {
  width: 1.08rem;
  height: 1.08rem;
  transform: none;
}

.language-switcher .nav-dropdown__menu {
  top: calc(100% + 0.8rem);
  right: 0;
  left: auto;
  min-width: 12rem;
  transform: none;
}

.site-header.is-scrolled .language-switcher summary,
.site-header--solid .language-switcher summary {
  border-color: rgba(7, 47, 49, 0.2);
  background: rgba(7, 47, 49, 0.035);
}

body.menu-open .language-switcher summary {
  color: var(--white);
  border-color: rgba(255, 255, 255, 0.34);
  background: rgba(255, 255, 255, 0.055);
}

html[dir="rtl"] .language-switcher .nav-dropdown__menu {
  right: auto;
  left: 0;
}

/* Arabic typography: Cairo is self-hosted from the official Google Fonts source. */
html[lang="ar"] body,
html[lang="ar"] button,
html[lang="ar"] input,
html[lang="ar"] select,
html[lang="ar"] textarea {
  font-family: "Cairo", "Manrope", sans-serif;
}

html[lang="ar"] .hero h1,
html[lang="ar"] .display-title,
html[lang="ar"] .statement__ticker span,
html[lang="ar"] .service-row h3,
html[lang="ar"] .process-step h3,
html[lang="ar"] .why__quote blockquote,
html[lang="ar"] .price-display__amount strong,
html[lang="ar"] .price-exclusions__rate strong,
html[lang="ar"] .service-card h3,
html[lang="ar"] .service-signal strong,
html[lang="ar"] .service-audience h3,
html[lang="ar"] .service-deliverable h3,
html[lang="ar"] .proof-strip dt,
html[lang="ar"] .service-story__content .display-title,
html[lang="ar"] .service-next a,
html[lang="ar"] .legal-hero h1,
html[lang="ar"] .legal-content h2,
html[lang="ar"] .legal-next strong,
html[lang="ar"] .mobile-menu nav > a {
  font-family: "Cairo", sans-serif;
  font-style: normal;
  font-weight: 700;
  letter-spacing: -0.035em;
}

html[lang="ar"] .hero h1 {
  max-width: 11.5ch;
  font-size: clamp(3.25rem, 5.8vw, 6.4rem);
  line-height: 1.02;
}

html[lang="ar"] .hero h1 em,
html[lang="ar"] .display-title em,
html[lang="ar"] .service-story__content .display-title em {
  font-style: normal;
  font-weight: 750;
}

html[lang="ar"] .display-title {
  line-height: 1.08;
}

html[lang="ar"] .legal-hero h1 {
  font-size: clamp(3.7rem, 7.5vw, 8.2rem);
  line-height: 1.08;
}

html[lang="ar"] .hero__intro,
html[lang="ar"] .section-intro,
html[lang="ar"] .legal-hero__lead,
html[lang="ar"] .legal-content p,
html[lang="ar"] .legal-list li {
  line-height: 1.95;
}

html[lang="ar"] .hero__eyebrow,
html[lang="ar"] .section-label,
html[lang="ar"] .service-card__category,
html[lang="ar"] .legal-hero__meta,
html[lang="ar"] .legal-hero__eyebrow,
html[lang="ar"] .legal-toc > span,
html[lang="ar"] .mobile-menu__legal p {
  letter-spacing: 0;
  text-transform: none;
}

html[lang="ar"] .button,
html[lang="ar"] .header-cta,
html[lang="ar"] .desktop-nav a,
html[lang="ar"] .nav-dropdown summary,
html[lang="ar"] .mobile-menu nav .mobile-menu__legal a {
  font-family: "Cairo", sans-serif;
  letter-spacing: 0;
}

html[lang="ar"] input[type="email"],
html[lang="ar"] input[type="tel"],
html[lang="ar"] a[href^="tel:"],
html[lang="ar"] a[href^="mailto:"],
html[lang="ar"] .ltr {
  direction: ltr;
  text-align: left;
  unicode-bidi: embed;
}

/* RTL layout: mirror reading flow while keeping photography itself unmirrored. */
html[dir="rtl"] .brand {
  direction: ltr;
}

html[dir="rtl"] .desktop-nav,
html[dir="rtl"] .nav-dropdown__menu,
html[dir="rtl"] .mobile-menu,
html[dir="rtl"] .section,
html[dir="rtl"] .service-story__content,
html[dir="rtl"] .legal-main {
  text-align: right;
}

html[dir="rtl"] .hero__content {
  text-align: right;
}

html[dir="rtl"] .hero__side-note {
  display: none;
}

html[dir="rtl"] .desktop-nav > a::after {
  transform-origin: left;
}

html[dir="rtl"] .desktop-nav > a:hover::after {
  transform-origin: right;
}

html[dir="rtl"] .service-row__detail li,
html[dir="rtl"] .service-card li,
html[dir="rtl"] .legal-list li {
  padding-right: 1.25rem;
  padding-left: 0;
}

html[dir="rtl"] .service-card li {
  padding-right: 1rem;
}

html[dir="rtl"] .service-row__detail li::before,
html[dir="rtl"] .service-card li::before,
html[dir="rtl"] .legal-list li::before {
  right: 0;
  left: auto;
}

html[dir="rtl"] .process-track__line span {
  transform-origin: right;
}

html[dir="rtl"] .process-step {
  padding-right: 0;
  padding-left: 2.5rem;
}

html[dir="rtl"] .why__visual {
  border-right: 0;
  border-left: 1px solid rgba(255, 255, 255, 0.14);
}

html[dir="rtl"] .why__quote {
  text-align: right;
}

html[dir="rtl"] .service-intro__aside {
  padding-right: clamp(1.5rem, 4vw, 4rem);
  padding-left: 0;
  border-right: 1px solid var(--line);
  border-left: 0;
}

html[dir="rtl"] .service-audience {
  padding-right: 0;
  padding-left: clamp(2rem, 5vw, 5rem);
}

html[dir="rtl"] .service-audience + .service-audience {
  padding-right: clamp(2rem, 5vw, 5rem);
  padding-left: 0;
  border-right: 1px solid rgba(255, 255, 255, 0.18);
  border-left: 0;
}

html[dir="rtl"] .service-signal {
  border-right: 0;
  border-left: 1px solid rgba(255, 255, 255, 0.14);
}

html[dir="rtl"] .service-signal:last-child {
  border-left: 0;
}

html[dir="rtl"] .legal-header__back svg,
html[dir="rtl"] .legal-next svg,
html[dir="rtl"] .service-next svg,
html[dir="rtl"] .service-card > a svg,
html[dir="rtl"] .credibility__links svg,
html[dir="rtl"] .button svg[data-lucide="arrow-right"],
html[dir="rtl"] .header-cta svg[data-lucide="arrow-up-right"],
html[dir="rtl"] .data-flow > svg {
  transform: scaleX(-1);
}

html[dir="rtl"] .legal-toc a:hover {
  padding-right: 0.35rem;
  padding-left: 0;
}

html[dir="rtl"] .legal-table-wrap th,
html[dir="rtl"] .legal-table-wrap td {
  padding-right: 0;
  padding-left: 1rem;
  text-align: right;
}

html[dir="rtl"] .legal-callout {
  border-right: 3px solid var(--gold);
  border-left: 0;
}

html[dir="rtl"] .cookie-status-grid,
html[dir="rtl"] .publication-checklist {
  border-right: 1px solid var(--line);
  border-left: 0;
}

html[dir="rtl"] .cookie-status-grid > div,
html[dir="rtl"] .publication-checklist > div {
  border-right: 0;
  border-left: 1px solid var(--line);
}

html[dir="rtl"] .mobile-menu nav .mobile-menu__legal a:nth-of-type(odd) {
  border-right: 0;
  border-left: 1px solid rgba(255, 255, 255, 0.13);
}

html[dir="rtl"] .mobile-menu nav .mobile-menu__legal a:nth-of-type(even) {
  padding-right: 0.75rem;
  padding-left: 0;
}

/* Keep wide-screen copy over the calm side of the photograph; only reading flow is mirrored. */
@media (min-width: 821px) {
  html[dir="rtl"] .hero__content {
    margin-right: auto;
    margin-left: 0;
  }

  html[dir="rtl"] .service-hero .hero__content {
    width: min(48rem, 62vw);
  }
}

@media (max-width: 1100px) {
  .language-switcher summary {
    width: 2.75rem;
    height: 2.75rem;
  }
}

@media (max-width: 820px) {
  html[dir="rtl"] .service-audience,
  html[dir="rtl"] .service-audience + .service-audience {
    padding-right: 0;
    padding-left: 0;
    border-right: 0;
  }

  html[dir="rtl"] .service-signal,
  html[dir="rtl"] .service-signal:last-child {
    border-left: 0;
  }

  html[dir="rtl"] .data-flow > svg {
    transform: rotate(90deg);
  }

  html[dir="rtl"] .hero__scrim {
    background:
      linear-gradient(270deg, rgba(3, 29, 30, 0.84), rgba(3, 29, 30, 0.25) 85%),
      linear-gradient(180deg, rgba(1, 13, 14, 0.2), transparent 45%, rgba(1, 16, 17, 0.6));
  }
}

@media (max-width: 580px) {
  html[lang="ar"] .hero h1,
  html[lang="ar"] .service-hero h1 {
    max-width: 100%;
    font-size: clamp(2.7rem, 12vw, 3.65rem);
    line-height: 1.06;
  }

  html[lang="ar"] .display-title,
  html[lang="ar"] .service-story__content .display-title {
    font-size: clamp(2.65rem, 12vw, 3.65rem);
    line-height: 1.12;
  }

  html[lang="ar"] .legal-hero h1 {
    font-size: clamp(3rem, 14vw, 4.2rem);
  }

  html[dir="rtl"] .service-intro__aside {
    padding-right: 1.2rem;
    padding-left: 0;
  }

  html[dir="rtl"] .mobile-menu nav .mobile-menu__legal a:nth-of-type(odd),
  html[dir="rtl"] .mobile-menu nav .mobile-menu__legal a:nth-of-type(even) {
    padding-right: 0;
    border-left: 0;
  }

  html[dir="rtl"] .service-hero .hero__scrim {
    background:
      linear-gradient(180deg, rgba(2, 24, 25, 0.3) 0%, rgba(2, 24, 25, 0.68) 50%, rgba(2, 24, 25, 0.94) 100%),
      linear-gradient(270deg, rgba(2, 24, 25, 0.42), rgba(2, 24, 25, 0.08));
  }
}
