﻿.language-switch { display: inline-flex; align-items: center; flex-shrink: 0; gap: 2px; padding: 3px; border: 1px solid var(--border-gold); border-radius: var(--radius-pill); direction: ltr; }
.language-switch button { padding: 6px 9px; border-radius: var(--radius-pill); color: var(--text-secondary); font-family: "Cairo", var(--font-sans); font-size: 12px; line-height: 1.5; white-space: nowrap; }
.language-switch button[aria-pressed="true"] { background: var(--accent-gold); color: var(--bg-primary); font-weight: 700; }
.language-switch button:focus-visible { outline: 2px solid var(--accent-gold-light); outline-offset: 3px; }
html[lang="ar"] { --font-sans: "Cairo", Tahoma, Arial, sans-serif; --font-serif: "Cairo", Tahoma, Arial, sans-serif; line-height: 1.85; }
html[lang="ar"] :is(h1, h2, h3, h4, p, a, button, span, label, div) { letter-spacing: normal; }
html[lang="ar"] :is(.hero-title, .company-intro-title, .portfolio-title, .contact-title) { line-height: 1.5; }
html[lang="ar"] .hero-title { font-size: clamp(36px, 4vw, 58px); }
html[lang="ar"] .company-intro-title { font-size: clamp(34px, 3vw, 46px); }
html[lang="ar"] .portfolio-title { font-size: clamp(34px, 3.4vw, 50px); }
html[lang="ar"] .contact-title { font-size: clamp(34px, 3.2vw, 50px); }
html[lang="ar"] :is(.gold-highlight, .portfolio-gold, .company-intro-title span) { font-style: normal; }
html[lang="ar"] :is(.expertise-title, .growth-title, .contact-form-title) { line-height: 1.65; }
html[lang="ar"] :is(.expertise-name, .why-name, .value-name) { line-height: 1.8; }
html[lang="ar"] .contact-form-title { font-size: clamp(24px, 2.1vw, 32px); }
html[lang="ar"] .contact-label { line-height: 1.8; }
html[lang="ar"] .contact-field label { line-height: 1.8; }
html[lang="ar"] .contact-input { line-height: 1.8; }
html[lang="ar"] .portfolio-tags > span { font-size: 11px; line-height: 1.8; }
html[lang="ar"] .portfolio-action { font-size: 12px; line-height: 1.8; }
html[lang="ar"] .portfolio-name { direction: ltr; text-align: right; unicode-bidi: isolate; }
html[lang="ar"] #who-we-are .company-intro-scene { transform: scaleX(-1); }
html[dir="rtl"] :is(.hero-actions, .company-intro-cta, .nav-cta, .mobile-drawer-btn) > svg,
html[dir="rtl"] .hero-actions a > svg,
html[dir="rtl"] .btn-next-project > span:last-child,
html[dir="rtl"] .mobile-nav-link > span:last-child { transform: scaleX(-1); }
html[dir="rtl"] .portfolio-arrow { transform: scaleX(-1); }
html[dir="rtl"] .portfolio-card:is(:hover, :focus-visible) .portfolio-arrow { transform: translate(-3px, -3px) scaleX(-1); }
html[dir="rtl"] .company-intro-cta:hover svg { transform: translateX(-3px) scaleX(-1); }
html[dir="rtl"] .contact-submit-arrow { transform: scaleX(-1); }
html[dir="rtl"] .contact-submit:not(:disabled):hover .contact-submit-arrow { transform: translateX(-3px) scaleX(-1); }
html[dir="rtl"] .contact-control-wrap :is(input[type="email"], input[type="tel"]) { padding-inline: 15px 43px; }
html[dir="rtl"] .gallery-stage-badge { left: auto; right: 20px; max-width: calc(100% - 40px); }
:is(input[type="email"], input[type="tel"]) { direction: ltr; unicode-bidi: isolate; }
.contact-channel-value[dir="ltr"] { unicode-bidi: isolate; }
.brand-emblem-svg, .mark-svg, .brand-logo-component { direction: ltr; }
.brand-logo-component { --font-serif: "Cormorant Garamond", Georgia, serif; --font-sans: "Plus Jakarta Sans", system-ui, sans-serif; }
.btn-arrow { display: inline-block; }
@media (max-width: 1439px) { .header-actions { gap: 8px; } }
@media (max-width: 768px) {
  html[lang="ar"] .hero-title { font-size: clamp(30px, 7vw, 44px); }
  html[lang="ar"] .company-intro-title { font-size: clamp(28px, 6vw, 38px); }
  html[lang="ar"] .portfolio-title { font-size: clamp(28px, 6vw, 38px); }
  html[lang="ar"] .contact-title { font-size: clamp(30px, 6.5vw, 42px); }
}
@media (max-width: 480px) {
  .header-inner { display: grid; grid-template-columns: minmax(0, 1fr); height: auto; min-height: 106px; padding-block: 10px; gap: 8px; }
  .brand-logo { margin-inline-end: auto; }
  .header-actions { width: 100%; justify-content: flex-end; }
  .language-switch { margin-inline-end: auto; }
  .language-switch button { padding: 4px 9px; }
  html[lang="ar"] .contact-input { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  html[dir="rtl"] .portfolio-card:is(:hover, :focus-visible) .portfolio-arrow { transform: scaleX(-1); }
  html[dir="rtl"] .company-intro-cta:hover svg,
  html[dir="rtl"] .contact-submit:not(:disabled):hover .contact-submit-arrow { transform: scaleX(-1); }
}
