@charset "UTF-8";

.home,
.menuContainer {
  background-color: #000;
  width: 100vw
}

a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block
}

body {
  line-height: 1;
  padding: 0
}

ol,
ul {
  list-style: none
}

blockquote,
q {
  quotes: none
}

blockquote:after,
blockquote:before,
q:after,
q:before {
  content: "";
  content: none
}

table {
  border-collapse: collapse;
  border-spacing: 0
}

@font-face {
  font-family: "Test Domaine Sans Display";
  src: url("../_fonts/domaine-sans-display-light.eot");
  src: url("../_fonts/domaine-sans-display-light.eot?#iefix") format("embedded-opentype"), url("../_fonts/domaine-sans-display-light.woff") format("woff"), url("../_fonts/domaine-sans-display-light.woff2") format("woff2"), url("../_fonts/domaine-sans-display-light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap
}

@font-face {
  font-family: "Test Domaine Sans Display";
  src: url("../_fonts/TestDomaineSansDisplay-Regular.eot");
  src: url("../_fonts/TestDomaineSansDisplay-Regular.eot?#iefix") format("embedded-opentype"), url("../_fonts/TestDomaineSansDisplay-Regular.woff") format("woff"), url("../_fonts/TestDomaineSansDisplay-Regular.woff2") format("woff2"), url("../_fonts/TestDomaineSansDisplay-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap
}

@font-face {
  font-family: "Test Domaine Sans Display";
  src: url("../_fonts/Domaine Sans Display Medium.eot");
  src: url("../_fonts/Domaine Sans Display Medium.eot?#iefix") format("embedded-opentype"), url("../_fonts/Domaine Sans Display Medium.woff") format("woff"), url("../_fonts/Domaine Sans Display Medium.woff2") format("woff2"), url("../_fonts/Domaine Sans Display Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap
}

@font-face {
  font-family: Byekan;
  src: url("../_fonts/B YekanplusRegular.eot");
  src: url("../_fonts/B YekanplusRegular.eot?#iefix") format("embedded-opentype"), url("../_fonts/B YekanplusRegular.woff") format("woff"), url("../_fonts/B YekanplusRegular.woff2") format("woff2"), url("../_fonts/B YekanplusRegular.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap
}

@font-face {
  font-family: Byekan;
  src: url("../_fonts/B YekanplusRegular.eot");
  src: url("../_fonts/B YekanplusRegular.eot?#iefix") format("embedded-opentype"), url("../_fonts/B YekanplusRegular.woff") format("woff"), url("../_fonts/B YekanplusRegular.woff2") format("woff2"), url("../_fonts/B YekanplusRegular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap
}

@font-face {
  font-family: Byekan;
  src: url("../_fonts/B Yekanplus Bold.eot");
  src: url("../_fonts/B Yekanplus Bold.eot?#iefix") format("embedded-opentype"), url("../_fonts/B Yekanplus Bold.woff") format("woff"), url("../_fonts/B Yekanplus Bold.woff2") format("woff2"), url("../_fonts/B Yekanplus Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap
}

@font-face {
  font-family: "Yekan Bakh FaNum";
  src: url("../_fonts/Yekan Bakh FA 04 Regular.eot");
  src: url("../_fonts/Yekan Bakh FA 04 Regular.eot?#iefix") format("embedded-opentype"), url("../_fonts/Yekan Bakh FA 04 Regular.woff") format("woff"), url("../_fonts/Yekan Bakh FA 04 Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap
}

@font-face {
  font-family: "Yekan Bakh FaNum";
  src: url("../_fonts/Yekan-Bakh-FaNum-03-Light.eot");
  src: url("../_fonts/Yekan-Bakh-FaNum-03-Light.eot?#iefix") format("embedded-opentype"), url("../_fonts/Yekan-Bakh-FaNum-03-Light.woff2") format("woff2"), url("../_fonts/Yekan-Bakh-FaNum-03-Light.woff") format("woff"), url("../_fonts/Yekan-Bakh-FaNum-03-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap
}

@font-face {
  font-family: "Yekan Bakh FaNum";
  src: url("../_fonts/Yekan-Bakh-FaNum-01-Hairline.eot");
  src: url("../_fonts/Yekan-Bakh-FaNum-01-Hairline.eot?#iefix") format("embedded-opentype"), url("../_fonts/Yekan-Bakh-FaNum-01-Hairline.woff2") format("woff2"), url("../_fonts/Yekan-Bakh-FaNum-01-Hairline.woff") format("woff"), url("../_fonts/Yekan-Bakh-FaNum-01-Hairline.ttf") format("truetype");
  font-weight: 100;
  font-style: normal
}

@font-face {
  font-family: "Yekan Bakh FaNum";
  src: url("../_fonts/Yekan Bakh FA 06 Bold.woff") format("woff"), url("../_fonts/Yekan Bakh FA 06 Bold.woff2") format("woff2"), url("../_fonts/Yekan Bakh FA 06 Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap
}

@font-face {
  font-family: Assistant;
  src: url("../_fonts/Assistant-Regular.eot");
  src: url("../_fonts/Assistant-Regular.eot?#iefix") format("embedded-opentype"), url("../_fonts/Assistant-Regular.woff2") format("woff2"), url("../_fonts/Assistant-Regular.woff") format("woff"), url("../_fonts/Assistant-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal
}

@font-face {
  font-family: DaxlinePro;
  src: url("../_fonts/DaxlinePro-Regular.eot");
  src: url("../_fonts/DaxlinePro-Regular.eot?#iefix") format("embedded-opentype"), url("../_fonts/DaxlinePro-Regular.woff2") format("woff2"), url("../_fonts/DaxlinePro-Regular.woff") format("woff"), url("../_fonts/DaxlinePro-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal
}

@font-face {
  font-family: "IRANSansWeb(FaNum)";
  font-weight: 400;
  font-style: bold;
  src: url("../_fonts/IRANSansWeb(FaNum).eot") format("embedded-opentype"), url("../_fonts/IRANSansWeb(FaNum).woff") format("woff"), url("../_fonts/IRANSansWeb(FaNum).ttf") format("truetype")
}

.faNum,
.faNump p {
  font-family: "IRANSansWeb(FaNum)" !important
}

header {
  padding: 18px 20px;
  position: fixed;
  width: -webkit-fill-available;
  width: -moz-available;
  width: fill-available;
  z-index: 10000;
  top: 0
}

.productShow .section1 .title,
header .headerContainer {
  display: flex;
  align-items: center;
  justify-content: space-between
}

header .headerContainer .barIcon button {
  background-color: transparent;
  border: 1px solid #c59b47;
  outline: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 2px 16px;
  border-radius: 32.5px
}

header .headerContainer .barIcon button span {
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  line-height: 19.26px;
  text-align: center;
  color: #fff
}

header .headerContainer .barIcon button .ham {
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: transform .4s;
  -moz-user-select: none;
  -webkit-user-select: none;
  user-select: none
}

.landing .faq .question.active::after,
header .headerContainer .barIcon button .hamRotate.active {
  transform: rotate(45deg)
}

header .headerContainer .barIcon button .hamRotate180.active {
  transform: rotate(180deg)
}

header .headerContainer .barIcon button .line {
  fill: none;
  transition: stroke-dasharray .4s, stroke-dashoffset .4s;
  stroke: white;
  stroke-width: 5.5;
  stroke-linecap: round
}

header .headerContainer .barIcon button .ham4 .bottom,
header .headerContainer .barIcon button .ham4 .top {
  stroke-dasharray: 40 121
}

header .headerContainer .barIcon button .ham4.active .bottom,
header .headerContainer .barIcon button .ham4.active .top {
  stroke-dashoffset: -68px
}

.activeMenu2 span {
  color: #fff !important
}

.activeMenu2 svg {
  stroke: white !important
}

header.header2 .barIcon button span {
  color: #000
}

header.header2 .barIcon svg .line,
header.header2 .barIcon svg path {
  stroke: black
}

.menuContainer {
  position: fixed;
  top: 0;
  height: 100vh;
  overflow-y: scroll;
  opacity: 0;
  transform: translateY(100vh);
  z-index: 1000
}

.menuContainer .sliderSection {
  margin-top: 140px
}

.menuContainer .sliderSection .headerMobileSlider {
  padding-bottom: 71px;
  position: relative
}

.home .section5 .sliderSection .swiper-slide,
.home .section5 .sliderSection .swiper-wrapper,
.home .section6 .swiper-wrapper,
.home .swiper-wrapper,
.menuContainer .sliderSection .headerMobileSlider .swiper-wrapper {
  height: -moz-fit-content;
  height: fit-content
}

.menuContainer .sliderSection .headerMobileSlider .swiper-slide a {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none
}

.blogShow .section2 .para,
.blogShow .section98 .keyWord,
.landing .section2 .para,
.landing .section3,
.menuContainer .sliderSection .headerMobileSlider .swiper-slide a .titleHe,
.productShow .section98 .keyWord,
.projectShow .section98 .keyWord,
.services .section2 .para,
.services .section3 {
  margin-top: 20px
}

.menuContainer .sliderSection .headerMobileSlider .swiper-slide a .titleHe h3 {
  font-family: "Test Domaine Sans Display";
  font-weight: 500;
  font-size: 34px;
  line-height: 47.19px;
  text-align: center;
  color: #fff
}

.menuContainer .sliderSection .headerMobileSlider .swiper-pagination-header {
  position: absolute;
  bottom: 31px;
  display: flex;
  justify-content: center;
  -moz-column-gap: 19px;
  column-gap: 19px;
  align-items: center;
  left: 0;
  right: 0
}

footer .copyRight,
footer ul {
  align-items: center;
  direction: rtl
}

.menuContainer .sliderSection .headerMobileSlider .swiper-pagination-header .swiper-pagination-bullet {
  width: 5px;
  height: 5px;
  background-color: #d9d9d9;
  opacity: 1;
  transition: .3s ease-in-out
}

.menuContainer .sliderSection .headerMobileSlider .swiper-pagination-header .swiper-pagination-bullet-active {
  width: 11px;
  height: 11px;
  background-color: #c59b47;
  transition: .3s ease-in-out
}

.menuContainer .menuItems {
  padding-bottom: 30px
}

.menuContainer .menuItems ul {
  text-align: center
}

.menuContainer .menuItems ul li {
  overflow: hidden;
  margin-bottom: 25px
}

.menuContainer .menuItems ul li a {
  color: #fff;
  font-family: Byekan;
  font-weight: 400;
  font-size: 20px;
  text-align: center;
  text-decoration: none;
  display: block;
  transform: translateY(10vh);
  line-height: 30px;
}

.openMenuContainer {
  opacity: 1;
  transform: translateY(0);
  transition: 1.5s ease-in-out
}

.openMenuContainerTop {
  opacity: 0;
  transform: translateY(-100vh);
  transition: 1.5s ease-in-out
}

footer {
  background-color: #0d0d0d;
  text-align: center;
  padding: 19px 20px 23px
}

.projectList .swiper-slide a,
footer a {
  text-decoration: none
}

footer .logo {
  padding: 10.92px;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 30px;
  border-bottom: 1px solid rgba(255, 255, 255, .37)
}

footer h4 {
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  line-height: 21.7px;
  color: #fff;
  margin-bottom: 5px;
  text-align: center
}

.landing #toc,
footer h5 {
  font-family: "IRANSansWeb(FaNum)"
}

footer h5 {
  font-size: 14px;
  font-weight: 400;
  line-height: 24.18px;
  color: #c59b47;
  margin-bottom: 10px;
  text-align: center
}

footer ul {
  display: flex;
  -moz-column-gap: 11.37px;
  column-gap: 11.37px;
  justify-content: center;
  margin-bottom: 40px
}

footer .copyRight {
  padding-top: 15px;
  border-top: 1px solid rgba(255, 255, 255, .301);
  display: flex;
  justify-content: space-between
}

footer .copyRight .logoTxt {
  display: flex;
  -moz-column-gap: 10px;
  column-gap: 10px;
  align-items: center;
  padding-right: 1px
}

footer .copyRight .logoTxt p {
  color: #fff;
  white-space: nowrap;
  font-family: Byekan;
  font-weight: 400;
  font-size: 10px;
  line-height: 22.87px;
  text-align: right
}

footer .copyRight .copyTxt {
  direction: ltr;
  padding-left: 1px
}

footer .copyRight .copyTxt span {
  font-family: Assistant;
  font-size: 10px;
  font-weight: 400;
  line-height: 13.08px;
  text-align: left;
  color: rgba(255, 255, 255, .5);
  direction: ltr
}

.aboutUs .section8 .brandTop .imgS,
.blogShow .section9 .relatedProduct .swiper-slide,
.contactUs,
.home .section8 .topSlider .brandTop .imgS {
  display: flex;
  align-items: center;
  justify-content: center
}

.contactUs .overlayInfo {
  width: 100%;
  min-height: 100vh;
  height: 100%;
  inset: 0;
  z-index: 1;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-position: center !important
}

.contactUs .overlayInfo .mainTxt {
  margin-top: 142px;
  text-align: center
}

.contactUs .overlayInfo .mainTxt h1 {
  font-family: Byekan;
  font-weight: 400;
  font-size: 28px;
  line-height: 28px;
  text-align: center;
  color: #fff;
  position: relative
}

.contactUs .overlayInfo .mainTxt h1::before {
  content: "";
  position: absolute;
  right: 0;
  width: 34%;
  height: 1px;
  background-color: #fff;
  top: 50%
}

.contactUs .overlayInfo .mainTxt p {
  font-family: Byekan;
  font-weight: 400;
  font-size: 16px;
  color: #fff;
  line-height: 20px;
  text-align: center;
  direction: rtl;
  max-width: 270px;
  margin: 30px auto 0
}

.aboutUs .section8 .brandBtm,
.contactUs .overlayInfo .company,
.contactUs .overlayInfo .mainTxt .socials,
.contactUs .overlayInfo .office,
.home .section8 .brandBtm {
  margin-top: 30px
}

.contactUs .overlayInfo .mainTxt .socials ul {
  display: flex;
  align-items: center;
  justify-content: center;
  -moz-column-gap: 19px;
  column-gap: 19px
}

.contactUs .overlayInfo .company h2,
.contactUs .overlayInfo .office h2 {
  font-family: Byekan;
  font-weight: 700;
  font-size: 16px;
  line-height: 24.8px;
  text-align: center;
  color: #c59b47;
  position: relative
}

.contactUs .overlayInfo .company h2::before,
.contactUs .overlayInfo .office h2::before {
  content: "";
  width: 45%;
  height: 1px;
  background-color: rgba(255, 255, 255, .493);
  top: 50%;
  right: 0;
  position: absolute
}

.contactUs .overlayInfo .company .address,
.contactUs .overlayInfo .company .fax,
.contactUs .overlayInfo .company .mail,
.contactUs .overlayInfo .company .mobile,
.contactUs .overlayInfo .company .phone,
.contactUs .overlayInfo .office .address,
.contactUs .overlayInfo .office .fax,
.contactUs .overlayInfo .office .mail,
.contactUs .overlayInfo .office .mobile,
.contactUs .overlayInfo .office .phone {
  direction: rtl;
  padding: 0 20px;
  text-align: center;
  margin-top: 15px
}

.contactUs .overlayInfo .company .address p,
.contactUs .overlayInfo .company .fax p,
.contactUs .overlayInfo .company .mail p,
.contactUs .overlayInfo .company .mobile p,
.contactUs .overlayInfo .company .phone p,
.contactUs .overlayInfo .office .address p,
.contactUs .overlayInfo .office .fax p,
.contactUs .overlayInfo .office .mail p,
.contactUs .overlayInfo .office .mobile p,
.contactUs .overlayInfo .office .phone p {
  direction: rtl;
  color: #fff;
  display: contents;
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  line-height: 19.26px;
  text-align: center
}

.contactUs .overlayInfo .company,
.landing .section5,
.services .section5 {
  padding-bottom: 40px
}

.aboutUs,
.blogShow,
.downloads,
.landing,
.services {
  background-color: #000
}

.downloads .section1 {
  padding-top: 158px
}

.downloads .section1 h1 {
  font-family: "Test Domaine Sans Display";
  font-size: 40px;
  font-weight: 400;
  line-height: 55.52px;
  text-align: center;
  color: #c59b47
}

.downloads .section1 p {
  margin-top: 19px;
  font-family: Byekan;
  font-weight: 400;
  font-size: 12px;
  line-height: 18.6px;
  text-align: center;
  color: #fff
}

.downloads .section1 .filters,
.productShow .section1 .imgS {
  margin-top: 40px
}

.downloads .section1 ul {
  display: flex;
  align-items: center;
  -moz-column-gap: 19px;
  column-gap: 19px;
  justify-content: center;
  overflow-x: scroll;
  direction: rtl;
  overflow-y: hidden
}

.downloads .section1 li button {
  background-color: transparent;
  color: #fff;
  outline: 0;
  width: 115px;
  height: 35px;
  cursor: pointer;
  text-align: center;
  border-radius: 26.1px;
  border: 1px solid #fff;
  position: relative;
  font-family: "Test Domaine Sans Display";
  font-size: 16px;
  font-weight: 400;
  line-height: 22.21px
}

.downloads .section1 li button:after {
  color: currentColor;
  content: attr(data-text);
  height: 100%;
  left: 0;
  right: 0;
  opacity: 0;
  position: absolute;
  transform: translateY(40%);
  width: 100%
}

.downloads .section1 li button:hover:after {
  opacity: 1;
  transform: translateY(0);
  transition: transform .3s, opacity .3s
}

.downloads .section1 li .activeBtn {
  border: 1px solid #c59b47;
  color: #c59b47
}

.downloads .section1 .activeBtn button {
  border: 1px solid #c59b47;
  color: #c59b47;
  transition: .3s ease-in-out
}

.downloads .section2 ul {
  margin-top: 44px;
  padding: 0 20px
}

.downloads .section2 ul li {
  border-bottom: 1px solid rgba(255, 255, 255, .527)
}

.downloads .section2 ul li a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  direction: rtl;
  padding: 30px 3px;
  text-decoration: none;
  color: #fff;
  font-family: "Test Domaine Sans Display";
  font-size: 18px;
  font-weight: 400;
  line-height: 24.98px;
  text-align: right
}

.downloads .section2 ul li:first-child {
  border-top: 1px solid rgba(255, 255, 255, .527)
}

.downloads .section2 ul .activeList,
.home .section1 .inner1 .title1 p span,
.productShow .section1 .title h1 span,
.productShow p a {
  color: #c59b47
}

.downloads .section2 ul .activeList circle,
.downloads .section2 ul .activeList path {
  stroke: #c59b47
}

.downloads .section3 {
  padding: 29px 29px 78px
}

.aboutUs .section1 .imgS img,
.aboutUs .section2 .imgSections img,
.aboutUs .section3 .leftMan .imgS img,
.aboutUs .section4 .leftMan .imgS img,
.aboutUs .section6 img,
.blogList .blogsContainer .blogItem a .imgS img,
.blogShow .section4 img,
.blogShow .section6 img,
.blogShow .section8 .relatedBlog .blogItem a .imgS img,
.downloads .section3 img,
.home .section5 .sliderSection .servicesList .imgS img,
.landing .section3 .sliderSection .servicesList .imgS img,
.productShow .section1 .imgS img,
.productShow .section5 .info ul li .order .modal .modal-body [data-bc-part-container],
.productShow .section5 img,
.productShow .section6 img,
.productShow .section7 .info .order .modal .modal-body [data-bc-part-container],
.productShow .section7 img,
.productShow .section8 img,
.projectList .swiper-slide .imgS img,
.projectShow .section2 img,
.projectShow .section7 img,
.services .section3 .sliderSection .servicesList .imgS img {
  width: 100%
}

.landing .section1,
.services .section1 {
  padding-top: 90px
}

.landing .section1 .back1,
.services .section1 .back1 {
  height: 530px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-attachment: fixed !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-position: center center !important
}

.landing .section1 .back1 p,
.services .section1 .back1 p {
  padding: 0 29px;
  font-family: Byekan;
  font-weight: 400;
  font-size: 22px;
  line-height: 22px;
  text-align: center;
  direction: rtl;
  color: #fff
}

.aboutUs .section7,
.blogShow .section2,
.blogShow .section5,
.blogShow .section7,
.home .section5 .sliderSection,
.home .section7,
.landing .blogListSection h1,
.landing .section3 .sliderSection,
.productShow .section7,
.services .section2,
.services .section3 .sliderSection {
  padding: 0 20px
}

.landing .section2 .data,
.services .section2 .data {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 14px
}

.blogShow .section2 .share,
.productShow .section1 .title .share,
.services .section2 .share {
  direction: rtl;
  display: flex;
  align-items: end;
  -moz-column-gap: 6px;
  column-gap: 6px;
  justify-content: end
}

.productShow .section1 .title .share .share__wrapper,
.productShow .section1 .title .share .social-link,
.projectShow .section1 .share .share__wrapper,
.projectShow .section1 .share .social-link,
.services .section2 .share .share__wrapper,
.services .section2 .share .social-link {
  position: relative;
  cursor: pointer;
  display: flex;
  align-items: end
}

.blogShow .section2 .share .toggle-button,
.productShow .section1 .title .share .toggle-button,
.projectShow .section1 .share .toggle-button,
.services .section2 .share .toggle-button {
  cursor: pointer;
  display: flex;
  white-space: nowrap;
  align-items: center;
  -moz-column-gap: 10px;
  column-gap: 10px;
  position: relative;
  direction: ltr
}

.aboutUs .section3 .leftMan .managerSounds,
.aboutUs .section4 .leftMan .managerSounds,
.landing .blogListSection .blogItem:nth-child(2)~.blogItem,
.play,
.productShow .section5 .info ul li .order .modal .modal-body [data-bc-title-container],
.productShow .section5 .info ul li .order .modal .modal-body legend,
.productShow .section5 .info ul li .order .modal .modal-header:after,
.productShow .section5 .info ul li .order .modal .modal-header:before,
.productShow .section7 .info .order .modal .modal-body [data-bc-title-container],
.productShow .section7 .info .order .modal .modal-body legend,
.productShow .section7 .info .order .modal .modal-header:after,
.productShow .section7 .info .order .modal .modal-header:before {
  display: none
}

.blogShow .section2 .share .toggle-button:focus,
.blogShow .section75 .btn:focus,
.productShow .section1 .title .share .toggle-button:focus,
.projectShow .section1 .share .toggle-button:focus,
.services .section2 .share .toggle-button:focus {
  outline: 0
}

.blogShow .section2 .share .toggle-button:after,
.blogShow .section2 .share .toggle-button:before,
.productShow .section1 .title .share .toggle-button:after,
.productShow .section1 .title .share .toggle-button:before,
.projectShow .section1 .share .toggle-button:after,
.projectShow .section1 .share .toggle-button:before,
.services .section2 .share .toggle-button:after,
.services .section2 .share .toggle-button:before {
  content: "";
  position: absolute
}

.blogShow .section2 .share .toggle-button:after,
.productShow .section1 .title .share .toggle-button:after,
.projectShow .section1 .share .toggle-button:after,
.services .section2 .share .toggle-button:after {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: .2s
}

.services .section2 .share .social-link {
  visibility: hidden;
  border-radius: 50%;
  transition: .1s;
  margin-left: 15px
}

.blogShow .section2 .share .share__wrapper--open-left .social-link,
.productShow .section1 .title .share .share__wrapper--open-left .social-link,
.projectShow .section1 .share .share__wrapper--open-left .social-link,
.services .section2 .share .share__wrapper--open-left .social-link {
  animation: 1s forwards right;
  opacity: 0;
  will-change: animation
}

.blogShow .section2 .share .share__wrapper--active .social-link,
.projectShow .section1 .share .share__wrapper--active .social-link,
.services .section2 .share .share__wrapper--active .social-link {
  animation: .1s forwards left;
  visibility: visible
}

.services .section2 .share .share__wrapper--active .social-link:first-child {
  animation-delay: 75ms
}

.services .section2 .share .share__wrapper--active .social-link:nth-child(2) {
  animation-delay: 50ms
}

.blogShow .section2 .share .visually-hidden,
.productShow .section1 .title .share .visually-hidden,
.projectShow .section1 .share .visually-hidden,
.services .section2 .share .visually-hidden {
  position: absolute;
  left: 9999px;
  width: 1px;
  height: 1px
}

.blogShow .section2 .share li,
.blogShow .section2 .share ul,
.productShow .section1 .title .share li,
.productShow .section1 .title .share ul,
.projectShow .section1 .share li,
.projectShow .section1 .share ul,
.services .section2 .share li,
.services .section2 .share ul {
  list-style-type: none;
  padding: 0;
  margin: 0
}

.blogShow .section2 .share button,
.productShow .section1 .title .share button,
.projectShow .section1 .share button,
.services .section2 .share button {
  border: none;
  margin: 0;
  padding: 0;
  width: auto;
  overflow: visible;
  background: 0 0;
  color: inherit;
  font: inherit;
  line-height: normal;
  -webkit-font-smoothing: inherit;
  -moz-osx-font-smoothing: inherit;
  -webkit-appearance: none
}

.landing .section2 h1,
.services .section2 h1 {
  color: #c59b47;
  font-family: Byekan;
  font-weight: 400;
  font-size: 20px;
  line-height: 20px;
  text-align: right;
  direction: rtl
}

.aboutUs .section2 .para p,
.blogShow .section2 .para p,
.landing .section2 .para p,
.services .section2 .para p {
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  line-height: 25.2px;
  text-align: justify;
  color: #fff;
  direction: rtl
}

.landing .section3 h2,
.services .section3 h2 {
  text-align: right;
  padding-right: 20px;
  font-family: Byekan;
  font-weight: 400;
  font-size: 20px;
  line-height: 20px;
  color: #c59b47;
  direction: rtl;
  margin-bottom: 20px
}

.aboutUs .section1,
.aboutUs .section6 .imgS,
.blogShow .section8 .relatedBlog .blogItem,
.services .section3 .sliderSection .servicesList {
  position: relative
}

.home .section5 .sliderSection .servicesList .btns,
.landing .section3 .sliderSection .servicesList .btns,
.services .section3 .sliderSection .servicesList .btns {
  margin-top: 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  direction: rtl
}

.home .section5 .sliderSection .servicesList .btns .swiper-button-disabled g path,
.landing .section3 .sliderSection .servicesList .btns .swiper-button-disabled g path,
.services .section3 .sliderSection .servicesList .btns .swiper-button-disabled g path {
  opacity: .5;
  transition: .3s
}

.landing .section3 .sliderSection .servicesList .swiper-pagination-services,
.services .section3 .sliderSection .servicesList .swiper-pagination-services {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 18px;
  display: flex;
  width: -moz-fit-content;
  width: fit-content;
  justify-content: center;
  -moz-column-gap: 15px;
  column-gap: 15px;
  align-items: center;
  z-index: 1000;
  margin: 0 auto
}

.home .section5 .sliderSection .servicesList .swiper-pagination-services .swiper-pagination-bullet,
.landing .section3 .sliderSection .servicesList .swiper-pagination-services .swiper-pagination-bullet,
.services .section3 .sliderSection .servicesList .swiper-pagination-services .swiper-pagination-bullet {
  width: 4px;
  height: 4px;
  opacity: 1;
  background-color: #d9d9d9;
  transition: .3s ease-in-out
}

.home .section5 .sliderSection .servicesList .swiper-pagination-services .swiper-pagination-bullet-active,
.landing .section3 .sliderSection .servicesList .swiper-pagination-services .swiper-pagination-bullet-active,
.services .section3 .sliderSection .servicesList .swiper-pagination-services .swiper-pagination-bullet-active {
  width: 8px;
  height: 8px;
  background-color: #c59b47;
  transition: .3s ease-in-out
}

.productShow .section5,
.productShow .section5 .info ul li .order .modal .modal-content,
.productShow .section7 .info .order .modal .modal-content {
  background-color: #f4f4f4
}

.home .section6,
.landing .section4,
.services .section4 {
  margin-top: 17px;
  padding: 0 20px;
  margin-bottom: 79px
}

.home .section6 .para p,
.landing .section4 .para p,
.services .section4 .para p {
  font-family: Byekan;
  color: #fff;
  direction: rtl;
  font-size: 14px;
  font-weight: 400;
  line-height: 25px;
  text-align: center
}

.home .section6 a,
.landing .section4 a,
.services .section4 a {
  text-decoration: none;
  color: #fff;
  display: flex;
  align-items: center;
  padding: 7px 23px;
  border: 1px solid #c59b47;
  border-radius: 29px;
  justify-content: center;
  width: -moz-fit-content;
  width: fit-content;
  margin: 20px auto 0
}

.landing .section5 .qoutt,
.services .section5 .qoutt {
  text-align: center;
  padding: 0 20px
}

.landing .section5 .qoutt q,
.services .section5 .qoutt q {
  quotes: "“" "”";
  font-family: Byekan;
  font-weight: 400;
  font-size: 16px;
  line-height: 16px;
  text-align: center;
  color: #fff
}

.landing .section5 .qoutt q span,
.services .section5 .qoutt q span {
  transform: translateY(-5px);
  display: inline-block
}

.landing .section5 .qoutt q::after,
.landing .section5 .qoutt q::before,
.services .section5 .qoutt q::after,
.services .section5 .qoutt q::before {
  color: #fff
}

.landing .section5 a,
.services .section5 a {
  display: block;
  margin: 20px auto 0;
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  align-items: center;
  -moz-column-gap: 20px;
  column-gap: 20px;
  padding: 7px 23px;
  color: #fff;
  text-decoration: none;
  border: 1px solid #c59b47;
  border-radius: 29px
}

.blogList {
  background-color: #000;
  padding-top: 116px;
  padding-bottom: 18px
}

.blogList h1 {
  font-family: Byekan;
  font-weight: 400;
  font-size: 34px;
  line-height: 52.7px;
  text-align: center;
  color: #fff
}

.blogList .blogsContainer {
  padding: 0 80px
}

.blogList .blogsContainer .blogItem {
  position: relative;
  padding-bottom: 38px;
  transform: translateY(10vh);
  opacity: 0
}

.blogList .blogsContainer .blogItem span,
.blogShow .section8 .relatedBlog .blogItem span {
  font-family: Byekan;
  font-weight: 400;
  font-size: 10px;
  line-height: 10px;
  text-align: right;
  color: #c59b47;
  writing-mode: vertical-lr;
  position: absolute;
  top: 15px;
  rotate: 180deg;
  left: -20px
}

.aboutUs .section1 .title h1,
.aboutUs .section1 .title p {
  font-family: "Test Domaine Sans Display";
  text-align: center;
  font-weight: 400
}

.blogList .blogsContainer .blogItem a,
.blogShow .section8 .relatedBlog .blogItem a {
  text-decoration: none;
  color: #fff
}

.blogList .blogsContainer .blogItem a h2,
.blogShow .section8 .relatedBlog .blogItem a h2,
.landing .blogListSection .blogList .blgTitle p {
  margin-top: 7px;
  font-family: Byekan;
  font-weight: 400;
  font-size: 12px;
  line-height: 18.6px;
  text-align: right;
  color: #fff
}

.aboutUs .splPara p .line {
  transform: translateY(70%);
  opacity: 0
}

.aboutUs .section1 .title {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center
}

.aboutUs .section1 .title h1 {
  font-size: 54px;
  line-height: 74.3px;
  margin-bottom: 7px;
  color: #fff
}

.aboutUs .section1 .title p {
  font-size: 32px;
  line-height: 44.03px;
  color: #fff
}

.aboutUs .section2 .imgSections {
  display: flex;
  align-items: baseline;
  justify-content: center;
  padding: 41px 20px 0;
  -moz-column-gap: 34px;
  column-gap: 34px
}

.aboutUs .section2 .imgSections .rightS {
  transform: translateY(-15px)
}

.aboutUs .section2 .imgSections .rightS h2 {
  position: relative;
  font-family: Byekan;
  font-weight: 400;
  font-size: 24px;
  line-height: 24px;
  text-align: right;
  color: #fff;
  margin-bottom: 11px
}

.aboutUs .section2 .imgSections .rightS h2::after {
  content: "";
  position: absolute;
  top: 50%;
  left: -65px;
  width: 77%;
  height: 1px;
  background-color: #fff
}

.aboutUs .section2 .para {
  padding: 7px 20px 70px
}

.aboutUs .section3 {
  display: flex;
  align-items: start;
  justify-content: center;
  -moz-column-gap: 20px;
  column-gap: 20px;
  padding: 0 20px 60px
}

.aboutUs .section3 .leftMan .imgS,
.aboutUs .section4 .leftMan .imgS {
  border-radius: 50%;
  overflow: hidden;
  width: 117px;
  transition: .5s
}

.aboutUs .section3 .leftMan .name,
.aboutUs .section4 .leftMan .name {
  margin-top: 7px;
  text-align: center
}

.aboutUs .section3 .leftMan .name span,
.aboutUs .section4 .leftMan .name span {
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  color: #545454;
  line-height: 23.63px;
  text-align: center
}

.aboutUs .section3 .leftMan .name h3,
.aboutUs .section4 .leftMan .name h3 {
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  color: #fff;
  line-height: 23.63px;
  text-align: center
}

.aboutUs .section3 .leftMan .name .svgS,
.aboutUs .section4 .leftMan .name .svgS {
  border-radius: 50%;
  border: 1px solid rgba(208, 208, 208, .6039215686);
  margin: 0 auto;
  display: flex;
  align-items: baseline;
  position: relative;
  -moz-column-gap: 2px;
  column-gap: 2px;
  opacity: .5;
  transition: .5s ease-in-out;
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center
}

.aboutUs .section3 .leftMan .name .svgS span,
.aboutUs .section4 .leftMan .name .svgS span {
  width: 1px;
  height: 9px;
  background-color: #fff
}

.aboutUs .section3 .leftMan .name .svgS:before,
.aboutUs .section4 .leftMan .name .svgS:before {
  border-radius: 50%;
  border-top: 1px solid #fff;
  content: "";
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 102%
}

.aboutUs .section3 .hoverPlay:hover .imgS,
.aboutUs .section4 .hoverPlay:hover .imgS {
  transform: scale(1.1);
  transition: .5s
}

.aboutUs .section3 .hoverPlay:hover .svgS,
.aboutUs .section4 .hoverPlay:hover .svgS {
  opacity: 1;
  transition: .5s ease-in-out
}

.aboutUs .section3 .hoverPlay:hover .svgS::before,
.aboutUs .section4 .hoverPlay:hover .svgS::before {
  animation: 2s forwards scrollDownBorderAnimation
}

.aboutUs .section3 .rightPara {
  max-width: 210px;
  margin-top: 11px
}

.aboutUs .section3 .rightPara p {
  font-family: Byekan;
  font-weight: 400;
  font-size: 12px;
  color: #fff;
  direction: rtl;
  line-height: 18.6px;
  text-align: center
}

.aboutUs .section4 {
  display: flex;
  justify-content: center;
  align-items: start;
  -moz-column-gap: 26px;
  column-gap: 26px
}

@keyframes scrollDownBorderAnimation {
  0% {
    transform: rotate(0)
  }

  100% {
    transform: rotate(1turn)
  }
}

.aboutUs .section5 .inVideo {
  padding: 0 20px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 60px
}

.aboutUs .section5 .inVideo video,
.productShow .section6 .inVideo video {
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover
}

.aboutUs .section5 .playbtn,
.home .section1 .inner2 .title2,
.home .section1 .inner4 .title4,
.productShow .section6 .inVideo .playbtn,
.projectShow .section5 .inVideo .playbtn {
  position: absolute
}

.aboutUs .section5 .par {
  text-align: center;
  margin-top: 15px
}

.aboutUs .section5 .par p {
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  direction: rtl;
  line-height: 19.32px;
  text-align: center;
  color: #fff
}

.aboutUs .section6,
.productShow .section2 {
  padding: 0 20px;
  margin-top: 20px
}

.aboutUs .section6 .imgS::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(50% 50% at 50% 50%, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .4) 100%)
}

.aboutUs .section7 h4 {
  font-family: Byekan;
  font-weight: 400;
  font-size: 16px;
  line-height: 16px;
  text-align: center;
  color: #fff;
  margin: 20px 0
}

.aboutUs .section7 p {
  font-family: Byekan;
  font-weight: 300;
  font-size: 14px;
  line-height: 25.2px;
  text-align: center;
  color: #fff
}

.aboutUs .section8,
.blogShow .section9 {
  margin-top: 60px
}

.aboutUs .section8 .topSlider .swiper-slide,
.home .section8 .topSlider .swiper-slide,
.productShow .section5 .sliderSection .sliderItems .btns .swiper-button-disabled {
  opacity: .5;
  transition: .5s
}

.aboutUs .section8 .topSlider .swiper-slide h4,
.home .section8 .topSlider .swiper-slide h4 {
  font-family: "Test Domaine Sans Display";
  font-size: 24px;
  font-weight: 500;
  line-height: 33.31px;
  letter-spacing: -.04em;
  text-align: center;
  color: #fff;
  white-space: nowrap
}

.aboutUs .section8 .topSlider .swiper-slide-active {
  transition: .5s;
  opacity: 1
}

.aboutUs .section8 .brandBtm .mid,
.home .section8 .brandBtm .mid {
  padding: 0 47px 0 61px
}

.aboutUs .section8 .brandBtm p,
.home .section8 .brandBtm p {
  color: #fff;
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  line-height: 25px;
  text-align: center;
  direction: rtl
}

.aboutUs .section8 .brandBtm .brandLink,
.home .section8 .brandBtm .brandLink {
  margin-top: 29px;
  text-align: center
}

.aboutUs .section8 .swiper-pagination-brand,
.home .section8 .swiper-pagination-brand {
  margin-top: 29px;
  display: flex;
  justify-content: center;
  -moz-column-gap: 15px;
  column-gap: 15px;
  align-items: center
}

.aboutUs .section8 .swiper-pagination-brand .swiper-pagination-bullet,
.home .section8 .swiper-pagination-brand .swiper-pagination-bullet {
  width: 4px;
  height: 4px;
  opacity: 1;
  background-color: #d9d9d9;
  border-radius: 50%;
  transition: .3s
}

.aboutUs .section8 .swiper-pagination-brand .swiper-pagination-bullet-active,
.home .section1 .swiper-pagination-mainSlider .swiper-pagination-bullet-active,
.home .section8 .swiper-pagination-brand .swiper-pagination-bullet-active {
  width: 8px;
  height: 8px;
  background-color: #c59b47;
  transition: .3s
}

.aboutUs .section9 {
  margin-top: 61px;
  padding-bottom: 51px
}

.aboutUs .section9 h4 {
  font-family: Byekan;
  font-weight: 400;
  font-size: 16px;
  line-height: 16px;
  text-align: center;
  color: #fff
}

.aboutUs .section9 .sliderSection {
  margin-top: 37px
}

.aboutUs .section9 .sliderSection .certificateSlider .swiper-slide {
  display: flex;
  justify-content: center
}

.aboutUs .section9 .sliderSection .certificateSlider .swiper-slide .imgS {
  border-radius: 50%;
  overflow: hidden;
  transition: 1s;
  width: -moz-fit-content;
  width: fit-content;
  text-align: center
}

.aboutUs .section9 .sliderSection .certificateSlider .swiper-slide .imgS img {
  filter: brightness(.6);
  transition: 1s
}

.aboutUs .section9 .sliderSection .certificateSlider .swiper-slide h6 {
  font-family: Byekan;
  font-size: 16px;
  font-weight: 400;
  line-height: 22.7px;
  text-align: right;
  color: #fff;
  margin-top: 27px;
  width: 147px
}

.aboutUs .section9 .sliderSection .certificateSlider .swiper-slide-active .imgS {
  border-radius: 0;
  transition: 1s
}

.aboutUs .section9 .sliderSection .certificateSlider .swiper-slide-active .imgS img {
  transition: 1s;
  filter: brightness(1)
}

.pause,
.productShow .section5 .info ul li .order .modal .close,
.productShow .section7 .info .order .modal .close {
  opacity: 1
}

.play {
  opacity: 0
}

.blogShow .section1 .imgS img {
  width: 100%;
  filter: brightness(.25)
}

.blogShow .section2 .share .share__wrapper,
.blogShow .section2 .share .social-link {
  position: relative;
  cursor: pointer;
  display: flex;
  align-items: normal
}

.blogShow .section2 .share .social-link {
  visibility: hidden;
  border-radius: 50%;
  transition: .1s;
  margin-left: 15px
}

.blogShow .section2 .share .share__wrapper--active .social-link:first-child {
  animation-delay: 75ms
}

.blogShow .section2 .share .share__wrapper--active .social-link:nth-child(2) {
  animation-delay: 50ms
}

.productShow .section1 .title .share .share__wrapper--active .social-link:first-child,
.projectShow .section1 .share .share__wrapper--active .social-link:first-child {
  animation-delay: 75ms
}

.blogShow .section2 .data {
  display: flex;
  justify-content: space-between;
  align-items: start;
  margin-top: 10px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(255, 255, 255, .288)
}

.blogShow .section2 .data h4 {
  font-family: "Yekan Bakh FaNum";
  font-weight: 100;
  font-size: 10px;
  line-height: 15.5px;
  text-align: right;
  color: #fff
}

.blogShow .section2 .data .date,
.blogShow .section2 .data .writer {
  display: flex;
  align-items: center;
  justify-content: right;
  -moz-column-gap: 10px;
  column-gap: 10px
}

.blogShow .section2 .data .date {
  margin-top: 8px
}

.blogShow .section2 h1 {
  font-family: "Yekan Bakh FaNum";
  font-weight: 700;
  font-size: 18px;
  line-height: 27.9px;
  text-align: right;
  margin-top: 7px;
  color: #c59b47
}

.blogShow .section3 {
  padding: 0 20px;
  margin-top: 30px
}

.blogShow .section3 h3 {
  font-family: Byekan;
  font-weight: 400;
  font-size: 16px;
  line-height: 28.8px;
  text-align: right;
  color: #c59b47
}

.blogShow .section3 .para p {
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  line-height: 25.2px;
  text-align: justify;
  direction: rtl;
  color: #fff
}

.blogShow .section4,
.blogShow .section6,
.landing .proListSection h1,
.projectShow .section2,
.projectShow .section5,
.projectShow .section7 {
  padding: 20px
}

.blogShow .section5 .para p,
.blogShow .section7 .para p {
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  line-height: 32.02px;
  text-align: justify;
  color: #fff;
  direction: rtl
}

.blogShow .section75 {
  margin: 60px 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  color: #fff
}

.blogShow .section75 blockquote {
  font-size: 16px;
  max-width: 55vw;
  line-height: 1.4;
  position: relative;
  direction: rtl;
  margin: 0 0 20px;
  font-family: Byekan;
  font-weight: 400;
  padding: .5rem
}

.blogShow .section8 h2,
.blogShow .section9 h2 {
  padding-right: 20px;
  line-height: 38.16px;
  font-family: Byekan;
  text-align: right
}

.blogShow .section75 blockquote:after,
.blogShow .section75 blockquote:before {
  position: absolute;
  color: #f1efe6;
  font-size: 5rem;
  width: 4rem;
  height: 4rem
}

.blogShow .section75 blockquote:before {
  content: "“";
  left: -4rem;
  bottom: 1rem
}

.blogShow .section75 blockquote:after {
  content: "”";
  top: -2rem;
  right: -2.5rem
}

.blogShow .section75 .btn {
  font-family: Byekan;
  font-weight: 300;
  font-size: 14px;
  text-transform: uppercase;
  color: #fff;
  border: none;
  box-shadow: 0 2rem 4rem rgba(0, 0, 0, .2);
  padding: 1rem 3rem;
  border-radius: 100px;
  background: #fff;
  background: linear-gradient(to right, #c59b47, transparent);
  cursor: pointer;
  overflow: hidden;
  transition: .5s;
  position: relative
}

.blogShow .section75 .btn:active {
  transform: translateY(-1px);
  box-shadow: 0 5px 10px rgba(0, 0, 0, .2)
}

.blogShow .section75 .btn>* {
  display: inline-block;
  height: 100%;
  width: 100%;
  transition: .5s cubic-bezier(.51, -.6, .45, 1.6)
}

.home .goDown .maskArrow,
.productCat .overlayCat .slideContainer .catListlayer ul li button a .maskArrow {
  background-color: #fff;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  transition: mask-image 2s ease-in-out
}

.blogShow .section75 .btn__invisible {
  padding: 2rem 0;
  position: absolute;
  top: -102%;
  left: 0;
  text-align: center
}

.blogShow .section75 .btn:hover {
  background: #fff;
  background: linear-gradient(to left, #c59b47, transparent)
}

.blogShow .section75 .btn:hover .btn__invisible {
  top: 26%;
  padding: 0;
  left: 0
}

.blogShow .section75 .btn:hover .btn__visible {
  transform: translateY(200%)
}

.blogShow .section8 {
  margin-top: 80px
}

.blogShow .section8 h2 {
  font-weight: 400;
  font-size: 28px;
  color: #c59b47
}

.blogShow .section8 .SliderSection {
  margin-top: 27px;
  position: relative;
  padding-bottom: 38px
}

.blogShow .section8 .SliderSection .swiper-scrollbar-blog {
  position: absolute;
  bottom: 10px;
  background-color: #d9d9d9;
  width: 227px;
  left: 0;
  right: 0;
  margin: 38px auto 0;
  height: 4.24px
}

.blogShow .section8 .SliderSection .swiper-scrollbar-blog .swiper-scrollbar-drag,
.blogShow .section9 .relatedProduct .swiper-scrollbar-product .swiper-scrollbar-drag {
  background-color: #c59b47
}

.blogShow .section98 {
  padding: 50px 20px;
  font-family: "Yekan Bakh FaNum";
  font-weight: 400;
  font-size: 14px;
  direction: rtl;
  line-height: 25.44px;
  color: #fff
}

.blogShow .section98 h1,
.productShow .section98 h1,
.projectShow .section98 h1 {
  font-weight: 700;
  font-size: 18px;
  margin-bottom: 50px
}

.blogShow .section9 h2 {
  font-weight: 400;
  font-size: 28px;
  color: #c59b47;
  margin-bottom: 27px
}

.blogShow .section9 .relatedProduct {
  position: relative;
  padding-bottom: 103px
}

.blogShow .section9 .relatedProduct .swiper-scrollbar-product {
  position: absolute;
  bottom: 60px;
  background-color: #d9d9d9;
  width: 227px;
  left: 0;
  right: 0;
  margin: 38px auto 0;
  height: 4.24px
}

.blogShow .section9 .relatedProduct .swiper-slide-active .overTitle {
  z-index: 10;
  opacity: 1;
  transition: .5s
}

.blogShow .section9 .relatedProduct a {
  position: relative;
  text-decoration: none
}

.blogShow .section9 .relatedProduct a .overTitle {
  position: absolute;
  inset: 0;
  background-color: rgba(69, 50, 12, .6980392157);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: -1;
  opacity: 0;
  transition: .5s
}

.blogShow .section9 .relatedProduct a .overTitle h5 {
  font-family: Byekan;
  font-weight: 700;
  font-size: 20px;
  color: #fff;
  line-height: 27.26px;
  text-align: center
}

.blogShow .section10 {
  padding: 0 20px 40px;
  direction: rtl
}

.blogShow .section10 h5 {
  font-family: Byekan;
  font-weight: 400;
  font-size: 28px;
  line-height: 38.16px;
  text-align: right;
  color: #c59b47;
  margin-bottom: 40px
}

.blogShow .section10 input,
.blogShow .section10 textarea {
  margin-bottom: 20px;
  width: calc(100% - 20px);
  background-color: transparent;
  border: none;
  border-bottom: 1px solid #fff;
  padding: 10px;
  color: #fff;
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px
}

.blogShow .section10 button {
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  background-color: transparent;
  color: #fff;
  border: 1px solid #c59b47;
  border-radius: 15px;
  width: 100px;
  padding: 5px 0
}

.projectShow .splPara .line {
  opacity: 0;
  transform: translateY(50%)
}

.projectShow .section1 {
  padding: 0 20px;
  margin-top: 115px
}

.projectShow .section1 .in1 {
  display: flex;
  align-items: end;
  justify-content: space-between;
  position: relative;
  justify-content: right
}

.projectShow .section1 .share {
  direction: rtl;
  display: flex;
  left: 0;
  align-items: end;
  -moz-column-gap: 6px;
  column-gap: 6px;
  justify-content: end;
  margin-bottom: 12px;
  position: absolute
}

.projectShow .section1 .share .social-link {
  visibility: hidden;
  border-radius: 50%;
  transition: .1s;
  margin-left: 15px
}

.projectShow .section1 .share .share__wrapper--active .social-link:nth-child(2) {
  animation-delay: 50ms
}

.projectShow .section1 .rightTitle h2 {
  font-family: "Yekan Bakh FaNum";
  font-weight: 400;
  font-size: 20px;
  line-height: 25.95px;
  text-align: right
}

.projectShow .section1 .rightTitle h1 {
  font-family: "Yekan Bakh FaNum";
  font-weight: 700;
  font-size: 24px;
  line-height: 31.14px;
  text-align: right;
  color: #c59b47
}

.projectShow .section1 .para {
  margin-top: 5px;
  font-family: "Yekan Bakh FaNum";
  font-weight: 400;
  line-height: 25.95px;
  text-align: right;
}

.productShow .section2 .para p,
.productShow .section4 .para p,
.projectShow .section1 .para p,
.projectShow .section4 p,
.projectShow .section6 p,
.projectShow .section8 p {
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  line-height: 25.2px;
  text-align: justify;
  direction: rtl
}

.projectShow .section3 {
  margin-top: -40px;
  text-align: center;
  overflow: hidden
}

.projectShow .section4,
.projectShow .section6,
.projectShow .section8 {
  padding: 0 20px;
  margin-top: -20px
}

.home .section1 .inner4,
.productShow .section6 .inVideo,
.projectShow .section5 .inVideo {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center
}

.projectShow .section5 .inVideo video {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%
}

.projectShow .section6 {
  margin: 0
}

.projectShow .section8 {
  margin-bottom: 71px;
  margin-top: 5px
}

.productShow .section9 a,
.projectShow .section9 a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none
}

.productShow .section9 a .imgS img,
.projectShow .section9 a .imgS img {
  width: 100%;
  filter: brightness(.5)
}

.productShow .section9 a .overTitle,
.projectShow .section9 a .overTitle {
  position: absolute;
  text-align: center
}

.productShow .section9 a .overTitle h3,
.projectShow .section9 a .overTitle h3 {
  font-family: Byekan;
  font-weight: 700;
  margin-bottom: 28px;
  font-size: 28px;
  line-height: 39.72px;
  text-align: left;
  color: #fff
}

.productShow .section98,
.projectShow .section98 {
  padding: 50px 20px;
  font-family: "Yekan Bakh FaNum";
  font-weight: 400;
  font-size: 14px;
  direction: rtl;
  line-height: 25.44px
}

.productShow h1,
.productShow h2 {
  font-family: "Yekan Bakh FaNum";
  font-weight: 700;
  font-size: 16px;
  direction: rtl;
  line-height: 25.44px
}

.productShow h3,
.productShow h4 {
  font-family: "Yekan Bakh FaNum";
  font-weight: 400;
  font-size: 14px;
  line-height: 25.44px;
  direction: rtl
}

.productShow h5,
.productShow h6 {
  font-family: "Yekan Bakh FaNum";
  font-weight: 300;
  font-size: 12px;
  line-height: 25.44px;
  direction: rtl
}

.productCat .overlayCat .slideContainer .catListlayer ul li,
.productShow .splPara .line {
  overflow: hidden
}

.productShow .splPara .line .word {
  transform: translateY(100%)
}

.productShow .splParaLine .line {
  opacity: 0;
  transform: translateY(100%)
}

.productShow .section1 {
  padding: 0 20px;
  margin-top: 130px
}

.productShow .section1 .title .share .social-link {
  visibility: hidden;
  border-radius: 50%;
  transition: .1s;
  margin-left: 15px
}

.productShow .section1 .title .share .share__wrapper--active .social-link {
  visibility: visible;
  animation: .1s forwards left
}

.productShow .section1 .title .share .share__wrapper--active .social-link:nth-child(2) {
  animation-delay: 50ms
}

@keyframes shareClose {
  0% {
    opacity: 0;
    transform: rotateY(0)
  }

  100% {
    opacity: 1;
    transform: rotateY(360deg)
  }
}

@keyframes left {
  0% {
    transform: translateX(-170%)
  }

  100% {
    opacity: 1;
    transform: translateX(0)
  }
}

@keyframes right {
  0% {
    transform: translateX(-170%)
  }

  100% {
    opacity: 0;
    transform: translateX(0)
  }
}

.productShow .section1 .title h1 {
  font-family: "Yekan Bakh FaNum";
  font-weight: 700;
  font-size: 24px;
  line-height: 33.66px;
  text-align: right
}

.productShow .section3 {
  text-align: center;
  overflow: hidden
}

.productShow .section4 {
  padding: 0 20px;
  margin-top: -20px;
  margin-bottom: 20px
}

.productShow .section5 {
  padding: 20px
}

.productShow .section5 .info ul li {
  padding: 12px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  direction: rtl;
  border-bottom: 1px solid #c59b47
}

.productShow .section5 .info ul li h3 {
  font-family: Byekan;
  font-size: 14px;
  font-weight: 400;
  line-height: 35.56px
}

.productShow .section5 .info ul li .colors {
  display: flex;
  align-items: center;
  padding: 8px 0;
  -moz-column-gap: 12px;
  column-gap: 12px
}

.productShow .section5 .info ul li .colors span {
  width: 19px;
  height: 19px;
  border-radius: 50%
}

.productShow .section5 .info ul li .download a,
.productShow .section7 .info .download a {
  display: flex;
  align-items: center;
  -moz-column-gap: 7px;
  column-gap: 7px;
  text-decoration: none
}

.productShow .section5 .info ul li .download h4 {
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  line-height: 25.44px;
  color: #000
}

.productShow .section5 .info ul li .order>button,
.productShow .section7 .info .order>button {
  background-color: transparent;
  outline: 0;
  border: 1px solid #c59b47;
  border-radius: 29px;
  display: flex;
  align-items: center;
  justify-content: center;
  -moz-column-gap: 20px;
  column-gap: 20px;
  padding: 7px 23px
}

.productShow .section5 .info ul li .order>button h5,
.productShow .section7 .info .order>button h5 {
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  line-height: 14px
}

.productShow .section5 .info ul li .order .modal .modal-dialog,
.productShow .section7 .info .order .modal .modal-dialog {
  top: 10%
}

.productShow .section5 .info ul li .order .modal .modal-body input,
.productShow .section5 .info ul li .order .modal .modal-body p,
.productShow .section7 .info .order .modal .modal-body input,
.productShow .section7 .info .order .modal .modal-body p {
  color: #000;
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  line-height: 25.44px;
  direction: rtl;
  text-align: right
}

.productShow .section5 .info ul li .order .modal .modal-body [data-bc-question] img,
.productShow .section7 .info .order .modal .modal-body [data-bc-question] img {
  width: auto
}

.productShow .section5 .info ul li .order .modal .modal-body .captchaContainerclass,
.productShow .section7 .info .order .modal .modal-body .captchaContainerclass {
  display: flex;
  align-items: center;
  -moz-column-gap: 10px;
  column-gap: 10px
}

.productShow .section5 .info ul li .order .modal .modal-body .captchaContainerclass input,
.productShow .section7 .info .order .modal .modal-body .captchaContainerclass input {
  margin-left: 10px
}

.productShow .section5 .info ul li .order .modal .modal-body button,
.productShow .section7 .info .order .modal .modal-body button {
  background: 0 0;
  border: 1px solid #c59b47;
  outline: 0;
  padding: 10px 25px;
  border-radius: 5px;
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  line-height: 25.44px;
  direction: rtl;
  text-align: right;
  color: #c59b47
}

.productShow .section5 .info ul li .order .modal .modal-header,
.productShow .section7 .info .order .modal .modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  line-height: 25.44px
}

.productShow .section5 .info ul li .order .modal .close span,
.productShow .section7 .info .order .modal .close span {
  font-size: 20px;
  color: #000;
  font-family: Byekan;
  font-weight: 400
}

.productShow .section5 .info ul li:last-child {
  border-bottom: none;
  padding-top: 29px
}

.productShow .section5 .sliderSection h2 {
  margin: 10px 0;
  font-family: Byekan;
  font-weight: 400;
  font-size: 18px;
  line-height: 26.5px;
  text-align: right;
  color: #c59b47;
  direction: rtl
}

.productShow .section5 .sliderSection .descriptionSlider p {
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  line-height: 20.61px;
  text-align: justify;
  direction: rtl
}

.productShow .section5 .sliderSection .descriptionSlider p span {
  color: #69374e
}

.productShow .section5 .sliderSection .sliderItems {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 30px
}

.productShow .section5 .sliderSection .sliderItems .fragm {
  font-family: DaxlinePro;
  font-size: 18px;
  font-weight: 400;
  line-height: 18.99px;
  color: #c59b47
}

.productShow .section5 .sliderSection .sliderItems .fragm span:first-child {
  font-size: 16px
}

.productShow .section5 .sliderSection .sliderItems .fragm span:last-child {
  font-size: 14px
}

.productShow .section5 .sliderSection .sliderItems .btns {
  display: flex;
  align-items: center;
  direction: rtl;
  -moz-column-gap: 10px;
  column-gap: 10px
}

.productShow .section5 .sliderSection .sliderItems .btns .nextBtn {
  transition: .5s;
  transform: rotate(180deg) translateY(3px)
}

.productShow .section5 .sliderSection .sliderItems .btns .prevBtn {
  transition: .5s
}

.productShow .section6 {
  padding: 24px 20px
}

.productShow .section8,
.productShow .section85 {
  padding: 0 20px;
  margin-bottom: 75px
}

.productShow .section6 .colorTxt {
  margin: 10px 0 30px
}

.productShow .section6 .colorTxt p {
  font-family: "Test Domaine Sans Display";
  font-size: 20px;
  font-weight: 400;
  line-height: 22.36px;
  letter-spacing: .035em;
  text-align: left;
  color: #c59b47
}

.productShow .section6 .para p,
.productShow .section7 .para p {
  text-align: justify;
  line-height: 25.44px;
  direction: rtl;
  font-weight: 400;
  font-size: 14px;
  font-family: Byekan
}

.productShow .section6 .para {
  margin: 20px 0
}

.productShow .section7 .info {
  padding: 20px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  direction: rtl
}

.productShow .section7 .info .download h4 {
  color: #000;
  font-family: Byekan;
  font-weight: 400;
  font-size: 18px;
  line-height: 25.44px
}

.productShow .section7 .para {
  margin-top: 20.55px
}

.productShow .section85 {
  direction: rtl
}

.productShow .section85 input,
.productShow .section85 textarea {
  width: 100%;
  direction: rtl;
  background-color: transparent;
  border: none;
  border-bottom: 1px solid #000;
  color: #000;
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  line-height: 25.44px;
  margin-bottom: 15px;
  direction: rtl;
  text-align: right
}

.productShow .section85 button {
  background-color: transparent;
  outline: 0;
  border: 1px solid #c59b47;
  border-radius: 29px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 85px;
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  padding: 5px 0;
  margin-top: 15px
}

.productShow .section85 .messageSend {
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  direction: rtl
}

.home {
  overflow: hidden
}

.home .goDown {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  z-index: 100;
  cursor: pointer;
  transform: translateY(30%);
  opacity: 0;
  transition: 1s ease-in-out 0.8s
}

.home .goDown .goIcon {
  position: relative;
  width: 115px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(208, 208, 208, .6039215686);
  height: 115px;
  border-radius: 50%
}

.home .goDown .goIcon:hover::before {
  animation: 1s forwards scrollDownBorderAnimation
}

.home .goDown .goIcon:before {
  border-radius: 50%;
  border-top: 1px solid #fff;
  content: "";
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%
}

.home .goDown .maskArrow {
  width: 20px;
  display: block;
  height: 21px;
  -webkit-mask: url('data:image/svg+xml;utf8,<svg width="51" height="52" viewBox="0 0 51 52" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_216_232)"><path d="M50.2 23.4988V33.9357L25.316 51.1999L0.699951 33.1651V23.4988L25.316 41.2767L50.2 23.4988Z" fill="%23D0D0D0"/><path d="M25.3162 41.2766V0.799805" stroke="%23D0D0D0" stroke-width="1.8" stroke-miterlimit="10"/></g><defs><clipPath id="clip0_216_232"><rect width="49.5" height="50.4" fill="white" transform="translate(0.700195 0.799805)"/></clipPath></defs></svg>') center/contain no-repeat;
  mask: url('data:image/svg+xml;utf8,<svg width="51" height="52" viewBox="0 0 51 52" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_216_232)"><path d="M50.2 23.4988V33.9357L25.316 51.1999L0.699951 33.1651V23.4988L25.316 41.2767L50.2 23.4988Z" fill="%23D0D0D0"/><path d="M25.3162 41.2766V0.799805" stroke="%23D0D0D0" stroke-width="1.8" stroke-miterlimit="10"/></g><defs><clipPath id="clip0_216_232"><rect width="49.5" height="50.4" fill="white" transform="translate(0.700195 0.799805)"/></clipPath></defs></svg>') center/contain no-repeat;
  -webkit-mask-size: 20px 21px;
  mask-size: 20px 21px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  transition: mask-image 2s ease-in-out, -webkit-mask-image 2s ease-in-out
}

.home .goDown .maskArrow span {
  height: 50px;
  width: 50px;
  background-color: #c59b47;
  display: block;
  transform: translateY(-100%)
}

.home .goDown:hover .maskArrow span {
  transform: translateY(100%);
  transition: .5s ease-in-out
}

.home .section1 .swiper-slide-active {
  z-index: 3
}

.home .section1 .swiper-wrapper,
.productCat .backSlider,
.productCat .backSlider .backgroundSlider,
.productCat .backSlider .imgS {
  height: 100%
}

.home .section1 .cta {
  padding: 12% 0
}

.home .section1 .cta__slider-wrapper {
  position: relative;
  width: 100%;
  float: left;
  height: 100svh
}

.home .section1 .cta__slider-wrapper .block {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 0
}

.home .section1 .cta__slider {
  min-height: 50vh
}

.home .section1 .cta__slider .swiper-slide {
  overflow: hidden;
  height: 100% !important
}

.home .section1 .cta__slider-arrows {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2
}

.home .section1 .cta__slider-arrow {
  position: absolute;
  top: 0;
  width: 50%;
  height: 100%
}

.home .section1 .cta__slider-arrow.cta__slider-arrow--previous {
  left: 0
}

.home .section1 .cta__slider-arrow.cta__slider-arrow--next {
  left: 50%
}

.home .section1 .cta__slider-item,
.home .section1 .swiper-container,
.home .section5 .sliderSection .servicesList,
.landing .section3 .sliderSection .servicesList,
.projectList .swiper-slide {
  position: relative
}

.home .section1 .cta__slider-item .media-wrapper {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0
}

.home .section1 .cta__slider-item img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover
}

.productCat,
.projectList {
  height: 100vh
}

.home .section1 .cta__slider-counter {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
  padding: 20px 40px;
  color: #fff
}

.home .section1 .cta__cta {
  padding-top: 12%;
  max-width: 480px
}

.home .section1 .swiper-pagination-mainSlider {
  left: 16px;
  bottom: -27px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  row-gap: 5px;
  top: unset;
  width: -moz-fit-content;
  width: fit-content
}

.productCat,
.productCat .overlayCat .catSlider {
  width: 100vw
}

.home .section1 .swiper-pagination-mainSlider .swiper-pagination-bullet {
  opacity: 1;
  background-color: #d9d9d9;
  width: 4px;
  height: 4px;
  transition: .3s
}

.home .section1 video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  filter: brightness(.35)
}

.home .section1 img {
  width: 100%;
  height: 100%;
  filter: brightness(.35)
}

.home .section1 .inner1 {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative
}

.home .section1 .inner1 .title1 {
  position: absolute;
  padding: 0 29px;
  z-index: 10;
  overflow: hidden
}

.home .section1 .inner1 .title1 p {
  transform: translateY(100%);
  opacity: 0;
  transition: .5s 0.5s;
  font-family: "Yekan Bakh FaNum";
  font-weight: 400;
  font-size: 34px;
  line-height: 40.27px;
  color: #fff;
  direction: rtl;
  text-align: center
}

.home .section1 .inner2 .title2 h2,
.home .section1 .inner2 .title2 p,
.home .section1 .inner4 .title4 h1 {
  font-size: 34px;
  line-height: 52.7px;
  font-weight: 400;
  letter-spacing: -.04em;
  font-family: "Yekan Bakh FaNum";
  direction: rtl;
  text-align: center;
  color: #fff
}

.home .section1 .swiper-slide-active .goDown {
  transform: translateY(0);
  opacity: 1;
  transition: 1.5s ease-in-out 1s
}

.home .section1 .swiper-slide-active .title1 p {
  transform: translateY(0);
  opacity: 1;
  transition: 1s ease-in-out 0.8s
}

.home .section1 .swiper-slide-active .title2,
.home .section1 .swiper-slide-active .title4 {
  margin-bottom: 20px
}

.home .section1 .swiper-slide-active .title2 h2,
.home .section1 .swiper-slide-active .title2 p,
.home .section1 .swiper-slide-active .title4 h1 {
  transform: translateY(0) !important;
  opacity: 1 !important;
  transition: 1s ease-in-out 0.5s !important
}

.home .section1 .swiper-slide-active .title2 a,
.home .section1 .swiper-slide-active .title4 a {
  transform: translateY(0) !important;
  opacity: 1 !important;
  transition: 1s ease-in-out 0.87s !important
}

.home .section1 .inner2 {
  position: relative;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center
}

.home .section1 .inner2 .title2 h2,
.home .section1 .inner2 .title2 p {
  transform: translateY(100%);
  opacity: 0;
  transition: .5s 0.5s;
  margin-bottom: 20px
}

.home .section1 .inner2 .title2 h2 span,
.home .section1 .inner2 .title2 p span {
  font-family: "Test Domaine Sans Display";
  font-size: 34px;
  font-weight: 500;
  line-height: 47.19px;
  letter-spacing: -.04em;
  text-align: center;
  margin-right: 5px
}

.home .section1 .inner2 .title2 a {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  transform: translateY(40%);
  opacity: 0;
  transition: .5s 0.5s
}

.home .section1 .inner4 img {
  height: 100vh;
  width: 100vw
}

.home .section1 .inner4 .title4 h1 {
  margin-bottom: 20px;
  transform: translateY(100%);
  opacity: 0;
  transition: 1s ease-in-out 0.5s
}

.home .section1 .inner4 .title4 a {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  transform: translateY(40%);
  opacity: 0;
  transition: 1s ease-in-out 0.5s
}

.home .section5 {
  padding-top: 60px;
}

.home .section5 h2 {
  font-family: "Yekan Bakh FaNum";
  font-size: 24px;
  font-weight: 400;
  line-height: 37.2px;
  text-align: center;
  color: #fff;
  margin-bottom: 14px
}

.home .section5 .sliderSection .servicesList .swiper-pagination-services {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 18px;
  display: flex;
  width: -moz-fit-content;
  width: fit-content;
  justify-content: center;
  -moz-column-gap: 10px;
  column-gap: 10px;
  align-items: center;
  z-index: 1000;
  margin: 0 auto
}

.home .section7 h3 {
  font-family: "Yekan Bakh FaNum";
  font-weight: 400;
  font-size: 24px;
  color: #fff;
  line-height: 37.2px;
  text-align: center;
  margin-bottom: 15px
}

.home .section7 .para p {
  font-family: "Yekan Bakh FaNum";
  font-weight: 400;
  font-size: 14px;
  line-height: 25px;
  text-align: center;
  color: #fff;
  direction: rtl
}

.home .section8 {
  margin-top: 60px;
  padding-bottom: 58px
}

.home .section8 .topSlider .swiper-slide-active,
.productCat .paginContainer .catPagination .swiper-pagination-bullet-active {
  opacity: 1;
  transition: .5s
}

.productCat {
  overflow: hidden;
  position: relative
}

.productCat .backSlider .imgS img {
  width: 100%;
  height: 100%;
  filter: brightness(.3)
}

.productCat .backgroundSlider .swiper-slide .imgS {
  width: 100%;
  height: 100%;
  overflow: hidden
}

.productCat .backgroundSlider .swiper-slide .imgS img {
  filter: brightness(.3);
  scale: 1.2;
  transition: 1s ease-in-out;
  width: 100%;
  height: 100%
}

.productCat .backgroundSlider .swiper-slide-active img {
  scale: 1 !important;
  transition: 1s ease-in-out
}

.productCat .overlayCat {
  position: absolute;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column
}

.productCat .overlayCat h1 {
  font-family: "Yekan Bakh FaNum";
  font-weight: 700;
  font-size: 18px;
  line-height: 27.9px;
  letter-spacing: -.04em;
  text-align: center;
  color: #fff;
  margin-bottom: 45px
}

.productCat .overlayCat .slideContainer .catListlayer {
  transform: scale(0);
  transform-origin: top;
  transition-delay: 2s !important;
  transition-property: transform !important;
  margin-top: 20px
}

.productCat .overlayCat .slideContainer .catListlayer ul {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  gap: 33px;
  direction: rtl
}

.productCat .overlayCat .slideContainer .catListlayer ul li button {
  transform: translateY(-110%);
  transition: .3s;
  display: flex;
  align-items: center;
  border: none;
  outline: 0;
  background-color: rgba(255, 255, 255, .2);
  border-radius: 29px;
  padding: 5px 10px
}

.productCat .overlayCat .slideContainer .catListlayer ul li button a {
  display: flex;
  direction: rtl;
  align-items: center;
  -moz-column-gap: 10px;
  column-gap: 10px;
  transition: .3s;
  color: #fff;
  text-decoration: none;
  font-family: "Yekan Bakh FaNum";
  font-weight: 400;
  font-size: 18px;
  line-height: 27.9px;
  text-align: center
}

.productCat .overlayCat .slideContainer .catListlayer ul li button a .arrowContainer {
  width: 17px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 17px
}

.errorPage,
.projectList {
  background-color: #000;
  align-items: center;
  display: flex
}

.productCat .overlayCat .slideContainer .catListlayer ul li button a .maskArrow {
  width: 10px;
  display: block;
  -webkit-mask: url('data:image/svg+xml;utf8,<svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_83_724)"><path d="M9.34351 17L5.82312 17L-0.000110042 8.454L6.08304 -1.42519e-07L9.34351 0L3.34699 8.454L9.34351 17Z" fill="%23C59B47"/><path d="M3.3471 8.45401L17 8.45401" stroke="%23C59B47" stroke-miterlimit="10"/></g><defs><clipPath id="clip0_83_724"><rect width="17" height="17" fill="white" transform="translate(17) rotate(90)"/></clipPath></defs></svg>') center/contain no-repeat;
  mask: url('data:image/svg+xml;utf8,<svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_83_724)"><path d="M9.34351 17L5.82312 17L-0.000110042 8.454L6.08304 -1.42519e-07L9.34351 0L3.34699 8.454L9.34351 17Z" fill="%23C59B47"/><path d="M3.3471 8.45401L17 8.45401" stroke="%23C59B47" stroke-miterlimit="10"/></g><defs><clipPath id="clip0_83_724"><rect width="17" height="17" fill="white" transform="translate(17) rotate(90)"/></clipPath></defs></svg>') center/contain no-repeat;
  -webkit-mask-size: 10px 10px;
  mask-size: 10px 10px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  transition: mask-image 2s ease-in-out, -webkit-mask-image 2s ease-in-out
}

.productCat .overlayCat .slideContainer .catListlayer ul li button a .maskArrow span {
  height: 20px;
  width: 20px;
  background-color: #c59b47;
  display: block;
  transform: translateX(100%);
  transition: .5s ease-in-out
}

.productCat .overlayCat .slideContainer .catListlayer ul li button:hover a {
  color: #c59b47;
  transition: .3s ease-in-out
}

.productCat .overlayCat .slideContainer .catListlayer ul li button:hover .maskArrow span {
  transform: translateX(0);
  transition: .5s ease-in-out
}

.productCat .overlayCat .swiper-slide-active .catListlayer {
  transform: scale(1) !important;
  transform-origin: top;
  transition-delay: 2s !important;
  transition-property: transform !important
}

.productCat .overlayCat .swiper-slide-active .catListlayer button {
  transform: translateY(0) !important;
  transition: 1s ease-in-out;
  transition-delay: 2s !important;
  transition-property: transform !important
}

.landing .proListSection .titleCat p,
.productCat .overlayCat .titleCat h2 {
  font-family: "Test Domaine Sans Display";
  font-size: 54px;
  font-weight: 500;
  line-height: 74.95px;
  text-align: center;
  color: #fff
}

.productCat .paginContainer {
  bottom: 53px;
  left: 0;
  right: 0;
  text-align: center;
  position: absolute;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto
}

.productCat .paginContainer span {
  font-family: "Yekan Bakh FaNum";
  font-weight: 400;
  font-size: 14px;
  line-height: 34.44px;
  color: #fff;
  text-align: center
}

.productCat .paginContainer .swip {
  bottom: 35px;
  animation: 3s ease-out infinite swip;
  width: 11px;
  position: absolute;
  border-radius: 50%;
  background-color: #d9d9d9;
  height: 11px
}

.productCat .paginContainer .catPagination {
  bottom: 35px
}

.productCat .paginContainer .catPagination .swiper-pagination-bullet {
  opacity: .5;
  width: 11px;
  height: 11px;
  background-color: #d9d9d9;
  transition: .5s
}

@keyframes swip {
  0% {
    opacity: 0;
    right: 0
  }

  25% {
    opacity: 1;
    right: 0
  }

  45% {
    opacity: 1;
    right: 70%
  }

  100%,
  65% {
    opacity: 0;
    right: 70%
  }
}

.projectList .swiper-slide a .title {
  position: absolute;
  bottom: 35px;
  left: 10px;
  right: 10px;
  color: #fff;
  transition: .3s;
  opacity: 0
}

.projectList .swiper-slide a .title h1 {
  font-family: Byekan;
  font-weight: 400;
  font-size: 22px;
  line-height: 22px;
  text-align: center;
  color: #fff
}

.projectList .swiper-slide a:hover .title {
  transition: .3s;
  opacity: 1
}

.errorPage {
  justify-content: center;
  flex-direction: column;
  width: 100svw;
  height: 100svh;
  direction: rtl;
  text-align: center
}

.errorPage h1 {
  font-family: Byekan;
  font-weight: 700;
  font-size: 128px;
  color: #fff
}

.errorPage .backmainPage,
.errorPage .para p,
.landing p {
  font-weight: 400;
  font-size: 14px;
  font-family: Byekan
}

.errorPage .para p {
  color: #fff;
  margin: 20px 0
}

.landing #toc a,
.landing .faq h1 {
  margin-bottom: 15px
}

.errorPage .backmainPage {
  text-decoration: none;
  color: #c59b47;
  border: 1px solid #c59b47;
  border-radius: 10px;
  display: block;
  transition: .5s;
  padding: 10px 20px;
  margin: 10px 0
}

.errorPage .backmainPage:hover {
  background-color: #c59b47;
  color: #000
}

.landing p {
  text-align: right;
  direction: rtl;
  color: #fff
}

.landing .faq .question,
.landing h1 {
  font-weight: 700;
  text-align: right;
  direction: rtl
}

.landing a {
  text-decoration: none;
  color: #c59b47
}

.landing h1 {
  font-family: Byekan;
  font-size: 22px;
  color: #c59b47
}

.landing .commentSection .header_small p,
.landing h2 {
  font-family: Byekan;
  font-weight: 700;
  font-size: 20px;
  text-align: right;
  direction: rtl;
  color: #c59b47
}

.landing h3,
.landing h4 {
  font-family: Byekan;
  font-weight: 400
}

.landing h3 {
  font-size: 18px;
  color: #c59b47;
  text-align: right;
  direction: rtl
}

.landing h4 {
  font-size: 16px;
  color: #c59b47
}

.landing h5,
.landing h6 {
  font-weight: 300;
  color: #c59b47;
  font-family: Byekan
}

.landing h5 {
  font-size: 14px
}

.landing h6 {
  font-size: 12px;
  text-align: right;
  direction: rtl
}

.landing .tableOc {
  padding: 0 20px;
  margin: 40px 0
}

.landing #toc {
  direction: rtl;
  color: #c59b47;
  counter-reset: nav0
}

.landing #toc a {
  text-decoration: none;
  font-size: 16px;
  color: #c59b47;
  display: inline-block
}

.landing #toc h2 {
  counter-reset: countH3;
  counter-increment: countH2
}

.landing #toc h3 {
  counter-reset: countH4;
  counter-increment: countH3
}

.landing #toc h4 {
  counter-reset: countH5;
  counter-increment: countH4
}

.landing #toc h5 {
  counter-reset: countH6;
  counter-increment: countH5
}

.landing #toc h6 {
  counter-increment: countH6
}

.landing #toc h2::before {
  content: counter(countH2) " - "
}

.landing #toc h3::before {
  content: counter(countH2) "." counter(countH3) " - "
}

.landing #toc h4::before {
  content: counter(countH2) "." counter(countH3) "." counter(countH4) " - "
}

.landing #toc h5::before {
  content: counter(countH2) "." counter(countH3) "." counter(countH4) "." counter(countH5) " - "
}

.landing #toc h6::before {
  content: counter(countH2) "." counter(countH3) "." counter(countH4) "." counter(countH5) "." counter(countH6) " - "
}

.landing #toc ul {
  list-style-type: none
}

.landing #toc>li {
  counter-increment: nav0;
  counter-reset: nav1
}

.landing #toc>li li {
  counter-increment: nav1;
  counter-reset: nav2
}

.landing #toc>li li li {
  counter-increment: nav2;
  counter-reset: nav3
}

.landing #toc>li li li li {
  counter-increment: nav3;
  counter-reset: nav4
}

.landing #toc>li li li li li {
  counter-increment: nav4;
  counter-reset: nav5
}

.landing #toc>li li li li li li {
  counter-increment: nav5;
  counter-reset: nav6
}

.landing #toc>li::before {
  content: counter(nav0) " - "
}

.landing #toc>li li::before {
  content: counter(nav0) "." counter(nav1) " - "
}

.landing #toc>li li li::before {
  content: counter(nav0) "." counter(nav1) "." counter(nav2) " - "
}

.landing #toc>li li li li::before {
  content: counter(nav0) "." counter(nav1) "." counter(nav2) "." counter(nav3) " - "
}

.landing #toc>li li li li li::before {
  content: counter(nav0) "." counter(nav1) "." counter(nav2) "." counter(nav3) "." counter(nav4) " - "
}

.landing #toc>li li li li li li::before {
  content: counter(nav0) "." counter(nav1) "." counter(nav2) "." counter(nav3) "." counter(nav4) "." counter(nav5) " - "
}

.landing #toc>li li li li li li li::before {
  content: counter(nav0) "." counter(nav1) "." counter(nav2) "." counter(nav3) "." counter(nav4) "." counter(nav5) "." counter(nav6) " - "
}

.landing .proListSection {
  margin-bottom: 50px
}

.landing .section2 {
  padding: 0 20px;
  direction: rtl
}

.landing .loaded {
  visibility: hidden;
  opacity: 0;
  height: 0;
  width: 0;
  display: none
}

.landing .blogListSection .loadMore {
  text-decoration: none;
  color: #fff;
  display: flex;
  align-items: center;
  padding: 7px 23px;
  border: 1px solid #c59b47;
  border-radius: 29px;
  justify-content: center;
  width: -moz-fit-content;
  width: fit-content;
  -moz-column-gap: 10px;
  column-gap: 10px;
  margin: 20px auto 0
}

.landing .blogListSection .loadMore svg {
  transform: rotate(-90deg)
}

.landing .blogListSection .blogList {
  padding-top: 50px
}

.landing .commentSection,
.landing .faq {
  margin-bottom: 50px;
  padding: 0 20px
}

.landing .faq .container {
  background-color: transparent;
  color: #fff;
  border-radius: 20px;
  box-shadow: 0 0 10px 0 rgba(197, 155, 71, .3764705882);
  margin: 20px 0;
  direction: rtl
}

.landing .faq .question {
  font-family: Byekan;
  font-size: 16px;
  color: #c59b47;
  padding: 20px 20px 20px 80px;
  position: relative;
  display: flex;
  align-items: center;
  cursor: pointer
}

.landing .faq .question::after {
  content: "+";
  font-size: 2.2rem;
  position: absolute;
  left: 20px;
  transition: .2s
}

.landing .faq .answercont {
  max-height: 0;
  overflow: hidden;
  transition: .3s
}

.landing .faq .answer {
  padding: 0 20px 20px;
  line-height: 1.5rem;
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px;
  direction: rtl;
  text-align: justify
}

.landing .commentSection .header_small {
  margin-bottom: 25px
}

.landing .commentSection .commentP {
  direction: rtl
}

.landing .commentSection .commentP input,
.landing .commentSection .commentP textarea {
  margin-bottom: 15px;
  width: 87%;
  padding: 10px 20px;
  background-color: transparent;
  border: none;
  border-bottom: 1px solid #fff;
  color: #fff;
  font-family: Byekan;
  font-weight: 400;
  font-size: 14px
}

.landing .commentSection .commentP .submitComment {
  display: flex;
  align-items: center;
  -moz-column-gap: 20px;
  column-gap: 20px;
  padding: 7px 23px;
  color: #fff;
  text-decoration: none;
  border: 1px solid #c59b47;
  border-radius: 29px;
  margin-top: 20px;
  background-color: transparent
}

.services .section1 .back1 p {
  font-family: "Test Domaine Sans Display" !important;
}

.brandTop .swiper-slide img {
  filter: grayscale(1);
}

.brandTop .swiper-slide:hover img {
  filter: unset;
}

.home .section1 .inner4 .title4 {
  top: 38%;
  left: 0;
  right: 0;
  z-index: 100;
  overflow: hidden;
}


.home .section1 .slide4 .swiper-slide .sliderTitle {
  position: absolute;
  top: 46%;
  left: 0;
  right: 0;
  z-index: 100;
  transform: translateY(40%);
  opacity: 0;
  transition: 1s ease-in-out 1s;
  overflow: hidden;
}

.home .section1 .slide4 .swiper-slide-active .sliderTitle {
  transform: translateY(0);
  opacity: 1;
  transition: 1s ease-in-out;
}

.home .section1 .slide4 .swiper-slide .sliderTitle h4 {
  opacity: 0;
  transform: translateY(100%);
}

.home .section1 .slide4.swiper-slide-active h4 {
  transform: translateY(0) !important;
  transition: transform 1s ease-in-out 0.25;
  opacity: 1 !important;
}

.home .section1 .slide4 .btns {
  position: absolute;
  width: 99%;
  top: 45%;
  display: flex;
  justify-content: space-between;
  z-index: 100;
  direction: rtl;
}

.home .section1 .slide4 .btns {

  top: 40%;
  margin: 0 auto;
  text-align: center;
  left: 0;
}

.home .section1 .slide4 .btns .nexBtn {
  margin-right: 20px;
}

.home .section1 .slide4 .btns .preBtn {
  margin-left: 20px;
}

.home .section1 .slide4 h4 {
  font-family: Byekan;
  font-weight: 400;
  font-size: 20px;
  line-height: 39.72px;
  text-align: center;
  color: #fff;
}

.home .section1 .slide4 h4 a {
  color: inherit;
  text-decoration: unset;
}

.swiper-button-disabled {
  display: none;
}

.aboutUs .section10 .in4 {
  display: flex;
  align-items: center;
  -moz-column-gap: 199px;
  column-gap: 199px;
  justify-content: space-between;
  flex-direction: column;
}

.aboutUs .section10 .lVideo .videoIn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.aboutUs .section10 .pR h5 {
  font-family: Byekan;
  font-weight: 400;
  font-size: 20px;
  line-height: 39.72px;
  text-align: center;
  color: #fff;
}

.aboutUs .section10 .pR h5 {
  font-size: 20px;
  line-height: 43.72px;
}

.aboutUs .section10 .pR .para {
  margin-top: 21px;
}

.aboutUs .section10 .pR .para p {
  font-size: 14px;
  line-height: 27.9px;
  color: #fff;
  font-family: "Yekan Bakh FaNum";
  direction: rtl;
  font-weight: 400;
  text-align: center;
  padding: 0 20px;
}

.aboutUs .section10 .lVideo .playbtn {
  position: absolute;
  cursor: pointer;
}

.play {
  opacity: 0;
  display: none;
}

.projectTitle2 {
  text-align: left;
  color: #fff;
  font-family: "Test Domaine Sans Display";
  transition: all 0.4s;
}

.title45 {
  font-family: "Test Domaine Sans Display";
}