/* v69 · Arabic hero layout only. Keep the photographic right-hand column
   physically anchored to the reservation button while its content reads RTL.
   No changes to other languages, background photos, or animations. */
html[lang="ar"] #istanbul-site .istanbul-hero .hero-inner.ruby-hero-copy,
html[lang="ar"] #mare-site .mare-main .mare-content.ruby-hero-copy {
  direction:ltr;
  display:flex;
  flex-direction:column;
  align-items:flex-end!important;
  text-align:right;
}

html[lang="ar"] #istanbul-site .ruby-hero-copy > :is(.ruby-hero-overline,.ruby-hero-title,p,.ruby-hero-actions),
html[lang="ar"] #mare-site .ruby-hero-copy > :is(.ruby-hero-overline,.ruby-hero-title,p,.ruby-hero-actions) {
  align-self:flex-end!important;
  margin-left:auto!important;
  margin-right:0!important;
  text-align:right!important;
}

/* The description previously occupied the left-hand half of the photograph.
   Its box now shares the actual right edge of the large Ruby title and CTA. */
html[lang="ar"] #istanbul-site .ruby-hero-copy > p,
html[lang="ar"] #mare-site .ruby-hero-copy > p {
  display:block;
  box-sizing:border-box;
  width:min(610px,100%)!important;
  max-width:100%;
  direction:rtl;
  unicode-bidi:isolate;
  font-family:'Noto Sans Arabic','Manrope',sans-serif;
  line-height:1.9;
  letter-spacing:0;
  text-align:right!important;
}

html[lang="ar"] #istanbul-site .ruby-hero-copy > .ruby-hero-overline,
html[lang="ar"] #mare-site .ruby-hero-copy > .ruby-hero-overline,
html[lang="ar"] #istanbul-site .ruby-hero-copy > .ruby-hero-actions,
html[lang="ar"] #mare-site .ruby-hero-copy > .ruby-hero-actions {
  align-items:flex-end!important;
}

html[lang="ar"] #istanbul-site .ruby-hero-copy > .ruby-hero-title,
html[lang="ar"] #mare-site .ruby-hero-copy > .ruby-hero-title {
  width:max-content;
  max-width:100%;
  direction:ltr;
  text-align:right!important;
}

@media(max-width:900px) {
  html[lang="ar"] #istanbul-site .ruby-hero-copy > p,
  html[lang="ar"] #mare-site .ruby-hero-copy > p {
    width:min(89%,500px)!important;
  }
}

@media(max-width:640px) {
  html[lang="ar"] #istanbul-site .ruby-hero-copy > p,
  html[lang="ar"] #mare-site .ruby-hero-copy > p {
    width:89%!important;
    font-size:clamp(13px,3.4vw,16px);
    line-height:1.8;
  }
}
