@import url('https://fonts.googleapis.com/css2?family=Alexandria:wght@400;500;600;700;800&family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap');

body{
  font-family:'IBM Plex Sans Arabic',Tahoma,sans-serif!important;
  line-height:1.85
}
h1,h2,h3,.hero h1,.section h2,.contact-box h2,
.project h3,.case-bottom h3{
  font-family:'Alexandria',Tahoma,sans-serif!important;
  letter-spacing:normal!important;
  line-height:1.48!important
}
.hero h1{
  font-size:clamp(35px,4.9vw,75px)!important;
  line-height:1.33!important
}
.hero-lead{
  font-size:clamp(15px,1.25vw,18px)!important;
  line-height:2!important
}
.nav a,.btn,.service p,.case-bottom p,.project p,.step p{
  font-family:'IBM Plex Sans Arabic',Tahoma,sans-serif!important;
  letter-spacing:normal!important
}
.section h2{
  font-size:clamp(31px,3.6vw,57px)!important
}
.brand{min-width:0;max-width:260px}
.v38-brand img{
  display:block;width:auto;max-height:52px;
  max-width:225px;object-fit:contain
}
.v38-brand svg{
  height:48px;width:auto;max-width:225px
}
.v38-brand .brand-icon{display:none!important}
.v38-brand .brand-copy{display:block}

.hero-art.v38-carousel{
  padding:18px 0 28px 12px;
  position:relative;min-width:0;direction:ltr
}
.hero-art.v38-carousel:before{
  background:#0b4635;
  inset:6% -4% 3% 10%;
  transform:rotate(-3deg)
}
.v38-screen{
  background:#f8f9f4;
  border:1px solid #cadccd;
  box-shadow:0 30px 64px #0b372b30;
  border-radius:23px;padding:12px;
  position:relative;z-index:2
}
.v38-screenbar{
  display:flex;justify-content:space-between;
  align-items:center;gap:10px;
  padding:11px 13px;
  border-radius:14px 14px 0 0;
  color:#3f6553;background:#e9efe7;
  font:800 10px 'Manrope',Arial,sans-serif;
  letter-spacing:.08em
}
.v38-slides{
  aspect-ratio:1.18/1;
  background:#e9efe8;
  border-radius:0 0 14px 14px;
  display:grid;overflow:hidden
}
.v38-slide{
  grid-area:1/1;display:none;
  flex-direction:column;
  min-height:0;min-width:0;
  text-decoration:none;color:#103b2d
}
.v38-slide.on{
  display:flex;animation:v38fade .38s ease
}
@keyframes v38fade{
  from{opacity:.3;transform:translateY(7px)}
  to{opacity:1;transform:none}
}
.v38-slide>img{
  display:block;width:100%;height:70%;
  min-height:0;object-fit:contain!important;
  padding:15px 15px 0;flex:1
}
.v38-slide>span{
  display:flex;align-items:center;
  justify-content:space-between;
  gap:10px;direction:rtl;
  padding:16px 22px 20px
}
.v38-slide strong{
  font:700 clamp(17px,2vw,27px) 'Alexandria',Tahoma,sans-serif;
  line-height:1.5
}
.v38-slide small{
  font:650 12px 'IBM Plex Sans Arabic',Tahoma,sans-serif;
  color:#297657
}
.v38-control{
  display:flex;align-items:center;
  justify-content:space-between;gap:9px;
  margin-top:13px;
  position:relative;z-index:4;
  font:700 10px 'Manrope',sans-serif;
  color:#587565
}
.v38-dots{display:flex;gap:7px}
.v38-dot{
  width:25px;height:7px;
  border:0;border-radius:99px;
  background:#9cb5a5;cursor:pointer
}
.v38-dot[aria-current=true]{
  width:45px;background:#0c6448
}
.v38-control>div:last-child{
  display:flex;gap:7px
}
.v38-control>div:last-child button{
  width:39px;height:39px;
  border:1px solid #c7d8c9;
  border-radius:50%;
  background:#f7faf2;
  color:#104b37;cursor:pointer;
  font-size:22px
}
@media(max-width:800px){
  .hero-art.v38-carousel{
    width:100%;max-width:630px;
    margin:auto;padding-right:6px
  }
  .hero h1{
    font-size:clamp(32px,7.5vw,57px)!important
  }
}
@media(max-width:540px){
  .v38-brand img{
    max-height:38px;max-width:158px
  }
  .v38-brand svg{
    max-height:38px;max-width:158px
  }
  .hero h1{
    font-size:clamp(30px,8vw,41px)!important
  }
  .v38-screen{
    padding:7px;border-radius:17px
  }
  .v38-screenbar{
    font-size:8px;padding:8px 10px
  }
  .v38-slides{aspect-ratio:1.02/1}
  .v38-slide>span{
    padding:10px 12px 14px
  }
  .v38-control>span{display:none}
}
@media(prefers-reduced-motion:reduce){
  .v38-slide.on{animation:none}
}

/* DAYEEM V39 LINE SPACING */

/* Main headings */
h1, h2, h3,
.section h2,
.contact-box h2,
.case-bottom h3,
.project h3,
.service h3,
.product h3,
.step h3 {
    line-height: 1.62 !important;
}

/* Hero heading */
.hero h1 {
    line-height: 1.56 !important;
}

/* Paragraphs */
.hero-lead,
.section-intro > p,
.case-bottom p,
.project p,
.service p,
.product p,
.step p,
.contact-box p {
    line-height: 2.12 !important;
}

/* Mobile adjustments */
@media (max-width: 540px) {
    .hero h1 {
        line-height: 1.50 !important;
    }

    .section h2,
    .contact-box h2 {
        line-height: 1.55 !important;
    }

    .hero-lead,
    .section-intro > p,
    .project p,
    .service p,
    .product p,
    .step p,
    .contact-box p {
        line-height: 2.05 !important;
    }
}

/* END V39 */