/* R36.2 Arabic page geometry and typography corrections.
   Loaded only by Arabic routes and after ayamen-rtl.css. */

@font-face{
  font-family:'AyamenArabic';
  src:url("/assets/fonts/TheYearofTheCamel-Medium.woff2") format("woff2"),url("/assets/fonts/TheYearofTheCamel-Medium.otf") format("opentype");
  font-style:normal;
  font-weight:400;
  font-display:swap;
}
@font-face{
  font-family:'AyamenArabic';
  src:url("/assets/fonts/TheYearofTheCamel-Medium.woff2") format("woff2"),url("/assets/fonts/TheYearofTheCamel-Medium.otf") format("opentype");
  font-style:normal;
  font-weight:500;
  font-display:swap;
}
@font-face{
  font-family:'AyamenArabic';
  src:url("/assets/fonts/TheYearofTheCamel-Medium.woff2") format("woff2"),url("/assets/fonts/TheYearofTheCamel-Medium.otf") format("opentype");
  font-style:normal;
  font-weight:600;
  font-display:swap;
}
@font-face{
  font-family:'AyamenArabic';
  src:url("/assets/fonts/TheYearofTheCamel-Bold.woff2") format("woff2"),url("/assets/fonts/TheYearofTheCamel-Bold.otf") format("opentype");
  font-style:normal;
  font-weight:700;
  font-display:swap;
}
@font-face{
  font-family:'AyamenArabic';
  src:url("/assets/fonts/TheYearofTheCamel-Bold.woff2") format("woff2"),url("/assets/fonts/TheYearofTheCamel-Bold.otf") format("opentype");
  font-style:normal;
  font-weight:800;
  font-display:swap;
}
@font-face{
  font-family:'AyamenArabic';
  src:url("/assets/fonts/TheYearofTheCamel-Bold.woff2") format("woff2"),url("/assets/fonts/TheYearofTheCamel-Bold.otf") format("opentype");
  font-style:normal;
  font-weight:900;
  font-display:swap;
}
html[lang="ar"]{
  --ayamen-ar-display:'AyamenArabic','The Year of the Camel',Tahoma,Arial,sans-serif;
  --ayamen-ar-text:'IBM Plex Sans Arabic','Noto Sans Arabic','Segoe UI',Tahoma,Arial,sans-serif;
}
html[lang="ar"],html[lang="ar"] body,
html[lang="ar"] button,html[lang="ar"] input,
html[lang="ar"] textarea,html[lang="ar"] select{
  font-family:var(--ayamen-ar-text)!important;
}
html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3,
html[lang="ar"] h4,html[lang="ar"] h5,html[lang="ar"] h6,
html[lang="ar"] .h1,html[lang="ar"] .h2,html[lang="ar"] .h3,
html[lang="ar"] .text-h1-lg,html[lang="ar"] .text-h1-lim,
html[lang="ar"] .text-h2-lg,html[lang="ar"] .text-h2-sm,
html[lang="ar"] .text-lead,html[lang="ar"] .text-lead-xl,
html[lang="ar"] .l-exquisite-content__title,
html[lang="ar"] .l-exquisite-mob-card__content-title,
html[lang="ar"] .l-gallery__title,
html[lang="ar"] .l-choice__title,
html[lang="ar"] .l-services-mob-card__content-title,
html[lang="ar"] .l-spaces-title{
  font-family:var(--ayamen-ar-display)!important;
  font-weight:500!important;
  font-style:normal!important;
  letter-spacing:0!important;
}
html[lang="ar"] .ayamen-ar-number,
html[lang="ar"] [data-ar-number],
html[lang="ar"] .js-content-animation-values-counter,
html[lang="ar"] .pd-counter,
html[lang="ar"] .pd-progress span{
  font-family:'AyamenArabic','Noto Sans Arabic',Tahoma,Arial,sans-serif!important;
  direction:rtl!important;
  unicode-bidi:isolate!important;
  font-variant-numeric:tabular-nums;
}

/* Mirror the complete header while preserving the centered brand. */
html[lang="ar"] .header__content.row{
  flex-direction:row-reverse!important;
  direction:ltr!important;
}
html[lang="ar"] .header .group--header{
  flex-direction:row-reverse!important;
  direction:ltr!important;
}
html[lang="ar"] .header .group--header > *{
  direction:rtl;
}
html[lang="ar"] .header .group--header a[href^="tel:"],
html[lang="ar"] .header .group--header a[href^="tel:"] * ,
html[lang="ar"] .header .ayamen-lang-switch[lang="en"]{
  direction:ltr!important;
  unicode-bidi:isolate!important;
}
html[lang="ar"] .header__content > .col:first-child{
  text-align:right!important;
}

/* Arabic block reveals do not use the English inactive character-title state. */
html[lang="ar"] .ayamen-ar-hero-title,
html[lang="ar"] .intro__title .ayamen-ar-hero-title{
  opacity:1!important;
  visibility:visible!important;
  clip-path:none!important;
  max-width:min(13ch,90vw)!important;
  line-height:1.05!important;
  text-align:right!important;
}
html[lang="ar"] .ayamen-ar-hero-title i{display:inline!important}

/* About: keep the editorial image/stat arrangement physical, make numbers stable. */
html[lang="ar"] .ab-info__numbers{direction:ltr!important}
html[lang="ar"] .ab-info__numbers > *{direction:rtl!important;text-align:right!important}
html[lang="ar"] .ab-info__numbers dl{direction:rtl!important;text-align:right!important}
html[lang="ar"] .ab-info__numbers dt,
html[lang="ar"] .ab-info__numbers dd{direction:rtl!important;text-align:right!important}
html[lang="ar"] .ab-info__numbers dt{white-space:nowrap!important}
html[lang="ar"] .ab-info__numbers .ayamen-ar-number{display:inline-block!important;min-width:0!important}

/* Careers second section: same physical composition as English — image left, copy right. */
@media(min-width:980px){
  html[lang="ar"] .b-benefits__content > .row:first-of-type{direction:ltr!important}
  html[lang="ar"] .b-benefits__content > .row:first-of-type .offset--md-6{
    margin-left:50%!important;
    margin-right:0!important;
    direction:rtl!important;
    text-align:right!important;
  }
  html[lang="ar"] .b-benefits__content .ayamen-career-feature-card{
    left:clamp(4.5rem,6.5vw,7.5rem)!important;
    right:auto!important;
    top:clamp(6.5rem,13vh,9rem)!important;
  }
  html[lang="ar"] .b-benefits__content > .row:nth-of-type(2){direction:rtl!important}
  html[lang="ar"] .b-benefits__content > .row:nth-of-type(2) h2{
    width:100%!important;
    text-align:right!important;
    line-height:1.02!important;
  }
}

/* Contact: map is mirrored to the physical left on Arabic pages. */
@media(min-width:768px){
  html[lang="ar"] .ayamen-contact-map-v3__embed{
    left:0!important;
    right:min(42vw,48rem)!important;
  }
  html[lang="ar"] .ayamen-contact-map-v3__embed::after{
    background:linear-gradient(270deg,var(--c-ocean-blue) 0%,rgba(var(--c-ocean-blue-rgb),.78) 24%,rgba(var(--c-ocean-blue-rgb),.22) 72%,rgba(var(--c-ocean-blue-rgb),.1) 100%),rgba(var(--c-ocean-blue-rgb),.34)!important;
  }
  html[lang="ar"] .ayamen-contact-map-v3 h1,
  html[lang="ar"] .ayamen-contact-map-v3 .c-intro__button,
  html[lang="ar"] .ayamen-contact-map-v3 .c-intro__bottom{
    margin-left:0!important;
    margin-right:auto!important;
  }
}

/* Projects listing: one unambiguous LTR measured track moving left; panels remain RTL. */
html[lang="ar"] .ayp-index{
  direction:ltr!important;
  text-align:left!important;
}
html[lang="ar"] .ayp-track,
html[lang="ar"] [data-ayp-track],
html[lang="ar"] .ayp-projects{
  direction:ltr!important;
  flex-direction:row!important;
  justify-content:flex-start!important;
  transform-origin:left center!important;
}
html[lang="ar"] .ayp-panel,
html[lang="ar"] .ayp-intro,
html[lang="ar"] .ayp-project,
html[lang="ar"] .ayp-closing{
  direction:rtl!important;
  text-align:right!important;
}
html[lang="ar"] .ayp-intro__grid{direction:rtl!important}
html[lang="ar"] .ayp-kicker,
html[lang="ar"] .ayp-scroll-cue{left:auto!important;right:clamp(2rem,5vw,6rem)!important}
html[lang="ar"] .ayp-project__meta,
html[lang="ar"] .ayp-project__footer{direction:rtl!important}
html[lang="ar"] .ayp-project__footer > span{white-space:nowrap!important}
html[lang="ar"] .ayp-intro h1,
html[lang="ar"] .ayp-project h2,
html[lang="ar"] .ayp-closing h2{
  font-family:'AyamenArabic','Noto Kufi Arabic',Tahoma,Arial,sans-serif!important;
  letter-spacing:0!important;
  line-height:1.02!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
@media(max-width:950px){
  html[lang="ar"] .ayp-track,
  html[lang="ar"] .ayp-projects{display:block!important;width:100%!important;transform:none!important}
  html[lang="ar"] .ayp-kicker,
  html[lang="ar"] .ayp-scroll-cue{right:1.25rem!important;left:auto!important}
  html[lang="ar"] .ayp-project h2{font-size:clamp(3.2rem,14vw,6rem)!important}
}

/* Individual project pages: LTR geometry, RTL panel contents, readable controls. */
html[lang="ar"] [data-project-detail]{direction:ltr!important}
html[lang="ar"] .pd-horizontal-shell,
html[lang="ar"] .pd-horizontal-track{direction:ltr!important}
html[lang="ar"] .pd-horizontal-track{flex-direction:row!important}
html[lang="ar"] .pd-panel{direction:rtl!important;text-align:right!important}
html[lang="ar"] .pd-hero-copy,
html[lang="ar"] .pd-overview,
html[lang="ar"] .pd-info,
html[lang="ar"] .pd-media,
html[lang="ar"] .pd-residences,
html[lang="ar"] .pd-cta>div{direction:rtl!important;text-align:right!important}
html[lang="ar"] .pd-hero-shade{
  background:linear-gradient(270deg,rgba(2,20,33,.8),rgba(2,20,33,.22) 58%,rgba(2,20,33,.05)),linear-gradient(0deg,rgba(2,20,33,.82),transparent 52%)!important;
}
html[lang="ar"] .pd-info{grid-template-columns:1fr minmax(240px,.34fr)!important}
html[lang="ar"] .pd-filter-row{
  grid-column:2!important;
  border-left:0!important;
  border-right:1px solid var(--pd-line)!important;
  padding-left:0!important;
  padding-right:1.2rem!important;
}
html[lang="ar"] .pd-info-panel{grid-column:1!important;padding-left:1.25rem!important;padding-right:0!important}
html[lang="ar"] .pd-filter-row button,
html[lang="ar"] .pd-mode-tabs button,
html[lang="ar"] .pd-unit-tabs button,
html[lang="ar"] .pd-plan-controls button{
  text-align:right!important;
  min-width:max-content!important;
  flex:0 0 auto!important;
}
html[lang="ar"] .pd-filter-row,
html[lang="ar"] .pd-mode-tabs,
html[lang="ar"] .pd-unit-tabs,
html[lang="ar"] .pd-plan-controls{
  direction:rtl!important;
  scrollbar-width:thin;
}
html[lang="ar"] .pd-progress{right:auto!important;left:1.15rem!important;direction:rtl!important}
html[lang="ar"] .pd-progress button{justify-content:flex-start!important}
html[lang="ar"] .pd-cta:after{
  background:linear-gradient(270deg,rgba(2,23,36,.92),rgba(2,23,36,.2) 72%),linear-gradient(0deg,rgba(2,23,36,.84),transparent 55%)!important;
}
html[lang="ar"] .pd-cta>div{padding-left:0!important;padding-right:clamp(2rem,8vw,9rem)!important}
html[lang="ar"] .pd-overview-stats div{border-right:0!important;border-left:1px solid rgba(255,255,255,.18)!important}
html[lang="ar"] .pd-overview-stats div:last-child{border-left:0!important}
html[lang="ar"] .pd-info-panel ul{padding-left:0!important;padding-right:1.1rem!important}
html[lang="ar"] .pd-note{border-left:0!important;border-right:4px solid var(--pd-blue)!important}
html[lang="ar"] .pd-expand{right:auto!important;left:.8rem!important}
html[lang="ar"] .pd-lightbox button{right:auto!important;left:1rem!important}
html[lang="ar"] .pd-counter{right:auto!important;left:1rem!important}
html[lang="ar"] .pd-hero h1,
html[lang="ar"] .pd-overview h2,
html[lang="ar"] .pd-info-panel h2,
html[lang="ar"] .pd-section-head h2,
html[lang="ar"] .pd-residences h2,
html[lang="ar"] .pd-cta h2{
  font-family:'AyamenArabic','Noto Kufi Arabic',Tahoma,Arial,sans-serif!important;
  letter-spacing:0!important;
  line-height:1.04!important;
}
@media(max-width:900px){
  html[lang="ar"] .pd-horizontal-shell{direction:ltr!important;scroll-snap-type:x mandatory!important}
  html[lang="ar"] .pd-panel{direction:rtl!important}
  html[lang="ar"] .pd-info{display:flex!important;flex-direction:column!important}
  html[lang="ar"] .pd-filter-row{order:0!important;width:100%!important;border-right:0!important;padding-right:0!important;overflow-x:auto!important;flex-wrap:nowrap!important}
  html[lang="ar"] .pd-info-panel{order:1!important;width:100%!important;padding:0!important}
  html[lang="ar"] .pd-progress{left:50%!important;right:auto!important;direction:ltr!important}
  html[lang="ar"] .pd-cta>div{padding-right:1.35rem!important;padding-left:1.35rem!important}
}

/* Keep local font metrics manageable in compact Arabic controls. */
html[lang="ar"] .btn__text,
html[lang="ar"] button,
html[lang="ar"] .pd-kicker,
html[lang="ar"] .ayp-kicker,
html[lang="ar"] .ayp-project__meta{
  letter-spacing:0!important;
}


/* Final Arabic viewport and reveal safeguards. */
html[lang="ar"] .ayamen-ar-hero-title[data-reveal-visible-force]{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
}
html[lang="ar"] body:has([data-project-detail]),
html[lang="ar"] [data-project-detail],
html[lang="ar"] .pd-horizontal-shell,
html[lang="ar"] .pd-horizontal-track{
  max-width:100vw!important;
}

/* Arabic hero composition: inset from the right edge and use responsive Arabic metrics. */
html[lang="ar"] body.about-page .intro__title,
html[lang="ar"] body:not(.about-page) .intro--business .intro__title{
  padding-right:clamp(2rem,5vw,5.5rem)!important;
  padding-left:clamp(1rem,2vw,2rem)!important;
}
html[lang="ar"] body.about-page .intro__title h1,
html[lang="ar"] .intro--business .intro__title h1{
  width:min(100%,9.5ch)!important;
  max-width:9.5ch!important;
  margin-right:0!important;
  margin-left:auto!important;
  font-size:clamp(4rem,6.1vw,7.2rem)!important;
  line-height:1.02!important;
  overflow:visible!important;
  text-wrap:balance!important;
}
@media(max-width:979px){
  html[lang="ar"] body.about-page .intro__title,
  html[lang="ar"] .intro--business .intro__title{
    padding-right:var(--ayamen-mobile-gutter,1.25rem)!important;
    padding-left:var(--ayamen-mobile-gutter,1.25rem)!important;
  }
  html[lang="ar"] body.about-page .intro__title h1,
  html[lang="ar"] .intro--business .intro__title h1{
    width:min(100%,10ch)!important;
    max-width:10ch!important;
    font-size:clamp(3.3rem,13.5vw,5.4rem)!important;
    line-height:1.05!important;
  }
}

/* Arabic projects use predictable full-viewport horizontal panels on desktop. */
@media(min-width:951px){
  html[lang="ar"] .ayp-intro,
  html[lang="ar"] .ayp-project,
  html[lang="ar"] .ayp-closing{
    width:100vw!important;
    min-width:100vw!important;
    max-width:100vw!important;
  }
  html[lang="ar"] .ayp-intro h1{
    max-width:8.5ch!important;
    font-size:clamp(4.2rem,7.2vw,8rem)!important;
  }
  html[lang="ar"] .ayp-project h2,
  html[lang="ar"] .ayp-closing h2{
    max-width:7ch!important;
    font-size:clamp(3.8rem,6vw,6.8rem)!important;
  }
}
