/*
 * ARABIDS 1.2.120 — restrained editorial type, compact device storytelling,
 * open full-bleed support photography. Supports legacy Elementor home content.
 * Official palette: wine #420B07, forest #143328, gold #A4865D,
 * warm sand #E4D5BF, ivory #EFE6D8.
 */

/* The section titles belong to the reading side, which is the RIGHT in AR
   and LEFT in EN. Their colour is a brand-ivory ink, not plain white. */
html body:is(.home,[data-page="home"]) .hero h1.title,
html[data-language="ar"] body.home .hero .arabids-hero-copy h1.title,
html[data-language="en"] body.home .hero .arabids-hero-copy h1.title {
  color: #EFE6D8 !important;
  -webkit-text-fill-color: #EFE6D8 !important;
}
html body:is(.home,[data-page="home"]) .hero .subtitle {
  color: #E4D5BF !important;
  -webkit-text-fill-color: #E4D5BF !important;
}
html body:is(.home,[data-page="home"]) :is(
  .core_benefits_section,.what_is_section,.who_its_for_section,.faq_section
) .arabids-editorial-intro {
  direction: rtl !important;
  justify-content: flex-start !important;
  min-height: clamp(185px,19vw,290px) !important;
  margin-bottom: clamp(8px,1.8vw,22px) !important;
}
html body:is(.home,[data-page="home"]) :is(
  .core_benefits_section,.what_is_section,.who_its_for_section,.faq_section
) .arabids-editorial-heading {
  direction: rtl !important;
  align-items: flex-start !important;
  text-align: right !important;
  width: min(680px,62%) !important;
  max-width: 100% !important;
  flex: 0 1 680px !important;
  padding: 16px clamp(3px,2vw,26px) !important;
}
html body:is(.home,[data-page="home"]) :is(
  .core_benefits_section,.what_is_section,.who_its_for_section,.faq_section
) .arabids-editorial-heading > h2.title {
  color: #EFE6D8 !important;
  -webkit-text-fill-color: #EFE6D8 !important;
  text-align: right !important;
  text-shadow: 0 2px 15px rgba(0,0,0,.43) !important;
  line-height: 1.38 !important;
  letter-spacing: normal !important;
}
html:is([dir="ltr"],[data-language="en"]) body:is(.home,[data-page="home"]) :is(
  .core_benefits_section,.what_is_section,.who_its_for_section,.faq_section
) .arabids-editorial-intro {
  direction: ltr !important;
}
html:is([dir="ltr"],[data-language="en"]) body:is(.home,[data-page="home"]) :is(
  .core_benefits_section,.what_is_section,.who_its_for_section,.faq_section
) .arabids-editorial-heading,
html:is([dir="ltr"],[data-language="en"]) body:is(.home,[data-page="home"]) :is(
  .core_benefits_section,.what_is_section,.who_its_for_section,.faq_section
) .arabids-editorial-heading > h2.title {
  direction: ltr !important;
  text-align: left !important;
}
/* Remove BOTH decorative bars: the heading flourish and translucent lines
   below every summary. Whitespace alone separates the typographic entries. */
html body:is(.home,[data-page="home"]) .arabids-editorial-heading::before,
html body:is(.home,[data-page="home"]) :is(
  .core_benefits_section,.what_is_section,.who_its_for_section,.faq_section
) .item::before,
html body:is(.home,[data-page="home"]) :is(
  .core_benefits_section,.what_is_section,.who_its_for_section,.faq_section
) .item::after {
  content: none !important;
  display: none !important;
  border: 0 !important;
}
html body:is(.home,[data-page="home"]) .core_benefits_section .flex > .item,
html body:is(.home,[data-page="home"]) :is(
  .what_is_section,.who_its_for_section,.faq_section
) .flex-wrap > .item {
  border: 0 !important;
  border-bottom: 0 !important;
  background: transparent !important;
  padding: clamp(14px,2.2vw,26px) clamp(7px,1.8vw,22px) !important;
  margin: 0 !important;
  min-height: 0 !important;
  gap: 8px !important;
  box-shadow: none !important;
}
html body:is(.home,[data-page="home"]) :is(
  .core_benefits_section,.what_is_section,.who_its_for_section,.faq_section
) :is(.flex,.flex-wrap) {
  align-items: start !important;
  row-gap: clamp(14px,2.2vw,30px) !important;
}
html body:is(.home,[data-page="home"]) :is(
  .core_benefits_section,.what_is_section,.who_its_for_section,.faq_section
) .item .title {
  color: #EFE6D8 !important;
  -webkit-text-fill-color: #EFE6D8 !important;
  font-weight: 800 !important;
  line-height: 1.48 !important;
  text-shadow: 0 2px 9px rgba(0,0,0,.38) !important;
  margin-bottom: 9px !important;
}
html body:is(.home,[data-page="home"]) :is(
  .core_benefits_section,.what_is_section,.who_its_for_section,.faq_section
) .item .subtitle {
  color: #E4D5BF !important;
  -webkit-text-fill-color: #E4D5BF !important;
  font-weight: 500 !important;
  line-height: 1.85 !important;
  margin: 0 !important;
  text-shadow: 0 2px 9px rgba(0,0,0,.48) !important;
}
/* Match the older 1.2.119 text selector's specificity exactly so its
   off-white text cannot defeat the official brand palette above. */
html body:is(.home,[data-page="home"]) .core_benefits_section .flex > .item .title,
html body:is(.home,[data-page="home"]) :is(.what_is_section,.who_its_for_section,.faq_section) .flex-wrap > .item .title {
  color:#EFE6D8 !important;
  -webkit-text-fill-color:#EFE6D8 !important;
}
html body:is(.home,[data-page="home"]) .core_benefits_section .flex > .item .subtitle,
html body:is(.home,[data-page="home"]) :is(.what_is_section,.who_its_for_section,.faq_section) .flex-wrap > .item .subtitle {
  color:#E4D5BF !important;
  -webkit-text-fill-color:#E4D5BF !important;
}
/* Even when Elementor serves an old block, the unwanted illustrative icons
   next to audience and why-choose captions cannot reappear. */
html body:is(.home,[data-page="home"]) :is(.what_is_section,.who_its_for_section) .item .image {
  display: none !important;
}
html body:is(.home,[data-page="home"]) :is(.what_is_section,.who_its_for_section) .item .flex {
  display: block !important;
  gap: 0 !important;
  margin: 0 !important;
  min-height: 0 !important;
  text-align: start !important;
}
html body:is(.home,[data-page="home"]) :is(.what_is_section,.who_its_for_section) .item :is(.content,.content-in) {
  width: 100% !important;
  flex: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}
/* Photo-side detail stays visible; the copy-side is a readable dark ink. */
html body:is(.home,[data-page="home"]) :is(
  .core_benefits_section,.what_is_section,.who_its_for_section,.faq_section
)::after {
  background:
    linear-gradient(270deg,rgba(9,20,16,.83) 0%,rgba(9,20,16,.54) 37%,rgba(9,20,16,.12) 79%,transparent 100%),
    linear-gradient(0deg,rgba(9,20,16,.78),transparent 58%) !important;
}
html:is([dir="ltr"],[data-language="en"]) body:is(.home,[data-page="home"]) :is(
  .core_benefits_section,.what_is_section,.who_its_for_section,.faq_section
)::after {
  background:
    linear-gradient(90deg,rgba(9,20,16,.83) 0%,rgba(9,20,16,.54) 37%,rgba(9,20,16,.12) 79%,transparent 100%),
    linear-gradient(0deg,rgba(9,20,16,.78),transparent 58%) !important;
}

/* App story: leave the phone and copy as ONE measured composition. The long
   outer scroll runway remains intact for its four synchronized screenshots. */
html body:is(.home,[data-page="home"]) .how_it_works_section {
  --arabids-app-stage-h: min(535px,max(240px,calc(100dvh - var(--arabids-preview-header,82px) - 152px)));
  background-color: #EFE6D8 !important;
  background-image: linear-gradient(90deg,rgba(239,230,216,.90),rgba(239,230,216,.82)),url('../images/brand-atmospheres/app-still-life-v116.jpg') !important;
  background-size: cover !important;
  background-position: center center !important;
  box-shadow: none !important;
}
html body:is(.home,[data-page="home"]) .how_it_works_section::before,
html body:is(.home,[data-page="home"]) .how_it_works_section::after,
html body:is(.home,[data-page="home"]) .how_it_works_section .container-circle-wrap,
html body:is(.home,[data-page="home"]) .how_it_works_section .circle-overlay,
html body:is(.home,[data-page="home"]) .how_it_works_section .flex.desktop::before,
html body:is(.home,[data-page="home"]) .how_it_works_section .how-it-works-slide-content::before,
html body:is(.home,[data-page="home"]) .how_it_works_section .how-it-works-slide-content::after {
  content: none !important;
  display: none !important;
  box-shadow: none !important;
}
html body:is(.home,[data-page="home"]) .how_it_works_section .container-flex > h2.title {
  color: #420B07 !important;
  -webkit-text-fill-color: #420B07 !important;
  text-align: right !important;
  font-weight: 800 !important;
  font-size: clamp(29px,3.2vw,45px) !important;
  margin: 0 0 15px !important;
  text-shadow: none !important;
}
html:is([dir="ltr"],[data-language="en"]) body:is(.home,[data-page="home"]) .how_it_works_section .container-flex > h2.title {
  text-align: left !important;
}
html body:is(.home,[data-page="home"]) .how_it_works_section .how-it-works-slide-content {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: clamp(12px,2vw,24px) 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  width: min(100%,555px) !important;
  min-height: 0 !important;
  margin: 0 !important;
  gap: clamp(8px,1vw,13px) !important;
  overflow: visible !important;
}
html body:is(.home,[data-page="home"]) .how_it_works_section .how-it-works-title {
  color: #420B07 !important;
  -webkit-text-fill-color: #420B07 !important;
  font-size: clamp(22px,2.3vw,31px) !important;
  line-height: 1.42 !important;
  font-weight: 800 !important;
}
html body:is(.home,[data-page="home"]) .how_it_works_section .how-it-works-subtitle {
  color: #143328 !important;
  -webkit-text-fill-color: #143328 !important;
  font-size: clamp(15px,1.36vw,18px) !important;
  line-height: 1.8 !important;
  font-weight: 500 !important;
}
@media (min-width:992px) {
  html body:is(.home,[data-page="home"]) .how_it_works_section .flex.desktop {
    display: grid !important;
    direction: rtl !important;
    grid-template-columns: minmax(0,1fr) auto !important;
    align-items: center !important;
    gap: clamp(22px,4vw,60px) !important;
    width: min(1020px,100%) !important;
    height: var(--arabids-app-stage-h) !important;
    max-height: var(--arabids-app-stage-h) !important;
    margin-inline: auto !important;
  }
  html:is([dir="ltr"],[data-language="en"]) body:is(.home,[data-page="home"]) .how_it_works_section .flex.desktop {
    direction: ltr !important;
  }
  html body:is(.home,[data-page="home"]) .how_it_works_section .flex.desktop > .how-it-works-swiper {
    width: 100% !important;
    height: var(--arabids-app-stage-h) !important;
    max-height: var(--arabids-app-stage-h) !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    align-self: center !important;
  }
  html body:is(.home,[data-page="home"]) .how_it_works_section .flex.desktop > .how-it-works-swiper .swiper-slide {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }
  html body:is(.home,[data-page="home"]) .how_it_works_section .flex.desktop > .how-it-works-swiper-2 {
    width: min(262px,max(117px,calc((100dvh - var(--arabids-preview-header,82px) - 152px) * .48841))) !important;
    min-width: 0 !important;
    height: var(--arabids-app-stage-h) !important;
    max-width: none !important;
    max-height: var(--arabids-app-stage-h) !important;
    aspect-ratio: 295 / 604 !important;
    margin: 0 !important;
    justify-self: center !important;
    align-self: center !important;
  }
}

/* Mobile: phone above caption, no halo or caption card; both fit inside the
   same sticky viewport and preserve native scrolling through four screens. */
@media (max-width:991px) {
  html body:is(.home,[data-page="home"]) :is(
    .core_benefits_section,.what_is_section,.who_its_for_section,.faq_section
  )::after {
    background: none !important;
  }
  html body:is(.home,[data-page="home"]) :is(
    .core_benefits_section,.what_is_section,.who_its_for_section,.faq_section
  ) .arabids-editorial-intro {
    min-height: clamp(175px,37vw,250px) !important;
    margin-bottom: 5px !important;
  }
  html body:is(.home,[data-page="home"]) :is(
    .core_benefits_section,.what_is_section,.who_its_for_section,.faq_section
  ) .arabids-editorial-heading {
    width: 100% !important;
    flex: 1 1 auto !important;
    padding: 8px 3px !important;
  }
  html body:is(.home,[data-page="home"]) .how_it_works_section {
    background-attachment: scroll !important;
    background-image: linear-gradient(180deg,rgba(239,230,216,.87),rgba(239,230,216,.96)),url('../images/brand-atmospheres/app-still-life-v116.jpg') !important;
  }
  html body:is(.home,[data-page="home"]) .how_it_works_section .container-flex > h2.title {
    text-align: right !important;
    font-size: clamp(25px,6.5vw,34px) !important;
    margin-bottom: 8px !important;
  }
  html:is([dir="ltr"],[data-language="en"]) body:is(.home,[data-page="home"]) .how_it_works_section .container-flex > h2.title {
    text-align: left !important;
  }
  html body:is(.home,[data-page="home"]) .how_it_works_section > .mobile {
    grid-template-columns: minmax(0,1fr) !important;
    grid-template-rows: auto auto !important;
    justify-content: center !important;
    align-content: center !important;
    gap: clamp(6px,1.5vh,12px) !important;
    padding: 3px 16px 12px !important;
  }
  html body:is(.home,[data-page="home"]) .how_it_works_section .how-it-works-swiper-2-mobile {
    height: min(52svh,425px,max(200px,calc(100dvh - var(--arabids-mobile-header-bottom,68px) - 195px))) !important;
    max-height: var(--arabids-mobile-fit-height,100svh) !important;
    aspect-ratio:295 / 604 !important;
    width:auto !important;
    margin:0 auto !important;
    align-self:center !important;
  }
  html body:is(.home,[data-page="home"]) .how_it_works_section .how-it-works-swiper-mobile {
    height: auto !important;
    max-width: 480px !important;
    align-self: start !important;
  }
  html body:is(.home,[data-page="home"]) .how_it_works_section .how-it-works-swiper-mobile .how-it-works-slide-content {
    padding: 8px 3px !important;
    margin: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    min-height: 0 !important;
  }
  html body:is(.home,[data-page="home"]) .how_it_works_section .how-it-works-swiper-mobile .how-it-works-title {
    font-size: clamp(18px,4.5vw,22px) !important;
    line-height: 1.36 !important;
  }
  html body:is(.home,[data-page="home"]) .how_it_works_section .how-it-works-swiper-mobile .how-it-works-subtitle {
    font-size: clamp(13px,3.45vw,15px) !important;
    line-height: 1.55 !important;
  }
}

/* Support: the GREEN panel is removed. The supplied text-free photography
   runs edge-to-edge; headline, contact actions and useful links sit directly
   on the picture without framed white/green rectangles. */
html body:is([data-page="support"],.arabids-support-page) .as-hero {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  background: #E4D5BF !important;
  padding: clamp(78px,10vw,145px) 0 !important;
  min-height: clamp(370px,42vw,600px) !important;
  display: flex !important;
  align-items: center !important;
  border: none !important;
}
html body:is([data-page="support"],.arabids-support-page) .as-hero::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  z-index: -2 !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: url('../images/brand-atmospheres/support-camera.jpg') 60% center / cover no-repeat !important;
  opacity: 1 !important;
  transform: scaleX(-1) !important;
}
html[dir="ltr"] body:is([data-page="support"],.arabids-support-page) .as-hero::before {
  transform: none !important;
}
html body:is([data-page="support"],.arabids-support-page) .as-hero::after {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  z-index: -1 !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(270deg,rgba(239,230,216,.89),rgba(239,230,216,.58) 39%,transparent 73%) !important;
  opacity: 1 !important;
  pointer-events:none !important;
}
html[dir="ltr"] body:is([data-page="support"],.arabids-support-page) .as-hero::after {
  background: linear-gradient(90deg,rgba(239,230,216,.89),rgba(239,230,216,.58) 39%,transparent 73%) !important;
}
html body:is([data-page="support"],.arabids-support-page) .as-hero-shell {
  display: block !important;
  width: min(1220px,calc(100% - 40px)) !important;
  position: relative !important;
  z-index: 1 !important;
}
html body:is([data-page="support"],.arabids-support-page) .as-hero-copy {
  width: min(610px,100%) !important;
  max-width:100% !important;
  text-align: start !important;
}
html body:is([data-page="support"],.arabids-support-page) .as-hero-stage {
  display: none !important;
}
html body:is([data-page="support"],.arabids-support-page) .as-hero h1 {
  color:#420B07 !important;
  -webkit-text-fill-color:#420B07 !important;
  text-shadow:0 2px 9px rgba(239,230,216,.25) !important;
}
html body:is([data-page="support"],.arabids-support-page) .as-eyebrow {
  color:#143328 !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  padding:0 !important;
}
html body:is([data-page="support"],.arabids-support-page) .as-btn-light {
  background:rgba(239,230,216,.72) !important;
  color:#420B07 !important;
  border:1px solid rgba(66,11,7,.28) !important;
}
html body:is([data-page="support"],.arabids-support-page) .as-btn-primary {
  color:#EFE6D8 !important;
}
html body:is([data-page="support"],.arabids-support-page) .as-last-section {
  position:relative !important;
  isolation:isolate !important;
  background:#420B07 !important;
  padding:clamp(70px,8vw,120px) 0 !important;
  overflow:hidden !important;
}
html body:is([data-page="support"],.arabids-support-page) .as-last-section::before {
  content:'' !important;
  display:block !important;
  position:absolute !important;
  inset:0 !important;
  z-index:-2 !important;
  background:url('../images/brand-atmospheres/account-coins.jpg') 60% center / cover no-repeat !important;
  transform:scaleX(-1) !important;
}
html[dir="ltr"] body:is([data-page="support"],.arabids-support-page) .as-last-section::before {
  transform:none !important;
}
html body:is([data-page="support"],.arabids-support-page) .as-last-section::after {
  content:'' !important;
  display:block !important;
  position:absolute !important;
  inset:0 !important;
  z-index:-1 !important;
  background:linear-gradient(270deg,rgba(66,11,7,.72),rgba(66,11,7,.35) 48%,transparent 86%) !important;
}
html[dir="ltr"] body:is([data-page="support"],.arabids-support-page) .as-last-section::after {
  background:linear-gradient(90deg,rgba(66,11,7,.72),rgba(66,11,7,.35) 48%,transparent 86%) !important;
}
html body:is([data-page="support"],.arabids-support-page) .as-links-panel-modern {
  display:flex !important;
  align-items:flex-start !important;
  flex-direction:column !important;
  gap:26px !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  border-radius:0 !important;
  padding:0 !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  overflow:visible !important;
}
html body:is([data-page="support"],.arabids-support-page) .as-links-panel-modern::after {
  content:none !important;
  display:none !important;
}
html body:is([data-page="support"],.arabids-support-page) .as-links-panel-modern h2 {
  color:#EFE6D8 !important;
  -webkit-text-fill-color:#EFE6D8 !important;
}
html body:is([data-page="support"],.arabids-support-page) .as-links-panel-modern .as-kicker {
  color:#E4D5BF !important;
}
html body:is([data-page="support"],.arabids-support-page) .as-links-modern {
  width:min(700px,100%) !important;
  min-width:0 !important;
  margin:0 !important;
}
html body:is([data-page="support"],.arabids-support-page) .as-links-modern a {
  background:transparent !important;
  color:#EFE6D8 !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  padding:10px 2px !important;
  font-weight:750 !important;
  text-shadow:0 2px 8px rgba(0,0,0,.25) !important;
}
html body:is([data-page="support"],.arabids-support-page) .as-links-modern a:hover {
  background:transparent !important;
  color:#E4D5BF !important;
  text-decoration:underline !important;
  text-underline-offset:5px !important;
}
@media(max-width:767px) {
  html body:is([data-page="support"],.arabids-support-page) .as-hero {
    min-height:510px !important;
    padding:70px 0 80px !important;
  }
  html body:is([data-page="support"],.arabids-support-page) .as-hero::before {
    background-position:58% center !important;
  }
  html body:is([data-page="support"],.arabids-support-page) .as-hero::after,
  html[dir="ltr"] body:is([data-page="support"],.arabids-support-page) .as-hero::after {
    background:linear-gradient(180deg,rgba(239,230,216,.94),rgba(239,230,216,.78) 53%,rgba(239,230,216,.1) 100%) !important;
  }
  html body:is([data-page="support"],.arabids-support-page) .as-last-section {
    min-height:450px !important;
  }
  html body:is([data-page="support"],.arabids-support-page) .as-last-section::after,
  html[dir="ltr"] body:is([data-page="support"],.arabids-support-page) .as-last-section::after {
    background:linear-gradient(180deg,rgba(66,11,7,.90),rgba(66,11,7,.46) 75%,rgba(66,11,7,.1)) !important;
  }
  html body:is([data-page="support"],.arabids-support-page) .as-links-modern {
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
  }
}