:root {
  /*primary colors*/
  --white: #ffffff;
  --black: #000000;
  --sa1: #ecf0f3;
  --sa2: #8a9ec0;
  --sa3: #f8f8f7;
  --sa4: #45658c;
  --sa5: #c7d1dc;
  --sa6: #dac2a8;
  --sa7: #b5c1d1;
  --sa8: #293d54;
  --sa9: #f4ede5;
  --sa10: #e9dacb;
  --sa11: #dcdcdc;
  --sa12: #f8fbff;
  --sa13: #e6f2ff;
  --sa14: #272727;
  --sa15: #004999;
  --fbtn: #203353;
}

#safayer, #safayer *{
	font-family: "IRANYekanXFaNum", "Vazir";
}

#zr_float_btn, #zr_float_btn * {
    font-family: "Vazir" !important;
}

/*global*/
.zr_flex_align_center {
  align-items: center;
}

/*main*/
main {
  margin-top: 6.75rem;
}
/*float btn*/
.zr_top_botton_wrapper {
  bottom: 1.5rem;
  justify-self: center;
  z-index: 999;
  direction: rtl;
}

.zr_top_btn_box {
  align-items: center;
  z-index: 99;
  border-radius: 999px;
  background: var(--fbtn);
  opacity: 0.8;
  padding: 0 1.75rem 0 0.5rem;
  width: 44vw;
  max-width: 838px;
  height: 65px;
  color: white;
}

.zr_top_btn_box p {
  color: var(--white);
}

.zr_top_btn_box button {
  opacity: 1;
  z-index: 99;
  cursor: pointer;
  border-radius: 999px;
  background-color: var(--white);
  width: 100%;
  height: 100%;
  color: var(--black);
  font-size: 1.125rem;
}

.zr_top_btn_botton {
  cursor: pointer;
  border-radius: 999px;
  width: 28%;
  height: 76%;
  overflow: hidden;
  -webkit-tap-highlight-color: transparent;
}

.zr_top_btn_animate {
  transform: skew(-20deg) translateX(105%);
  opacity: 0.5;
  transition: transform 0.5s ease;
  background: linear-gradient(
    289.04deg,
    #ffffff00 26.02%,
    #c0d0d0 48.66%,
    #ffffff00 71.3%
  );
  width: 55%;
  height: 100%;
}

.zr_top_btn_botton:hover .zr_top_btn_animate {
  transform: skew(-20deg) translateX(-190%);
}

/*hero section*/
.zr_hero {
  background: radial-gradient(
    88.69% 88.32% at 50% 11.68%,
    var(--sa1) 0%,
    var(--sa2) 100%
  );
  height: 931px;
  overflow: hidden;
}

.zr_hero_text {
  margin-top: 4rem;
}

.zr_hero_text p:first-child {
  font-size: 4rem;
  line-height: 100%;
  font-family: "MsMadi";
}

#zr_safayer_title{
	 font-family: "MsMadi" !important;
}

.zr_hero_text p:nth-child(2) {
  font-size: 4.875rem;
  line-height: 100%;
}

.zr_hero_text p:nth-child(3) {
  font-size: 1rem;
  line-height: 3rem;
}

.zr_hero_text p:last-child {
  font-size: 1.5rem;
  line-height: 3rem;
}

.zr_hero_pics_wrapper {
  z-index: 10;
  margin-top: 0.5rem;
  padding: 0 min(126px, 6.5vw);
  width: 100%;
  height: 60%;
  max-height: 634px;
}

.zr_hpic_right {
  right: min(126px, 6.5vw);
  z-index: 15;
  width: 29%;
  height: 100%;
}

.zr_hpic_right img:first-child {
  z-index: 20;
  filter: drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.1))
    drop-shadow(0px 7px 7px rgba(0, 0, 0, 0.09))
    drop-shadow(0px 17px 10px rgba(0, 0, 0, 0.05))
    drop-shadow(0px 30px 12px rgba(0, 0, 0, 0.01));
  margin-right: 8%;
  max-width: 105px;
}

.zr_hpic_right img:nth-child(2) {
  margin-top: -9%;
  margin-right: 21%;
  max-width: 414px;
}

.zr_hpic_right img:last-child {
  margin-top: 10%;
  margin-left: 35%;
  max-width: 362px;
}

.zr_hpic_center {
  z-index: 20;
  width: 42%;
  height: 100%;
}

.zr_hpic_center img {
  top: 50%;
  transform: translateY(-40%);
  filter: drop-shadow(0px 12px 24px rgba(0, 0, 0, 0.26))
    drop-shadow(0px 36px 40px rgba(0, 0, 0, 0.22))
    drop-shadow(0px 72px 56px rgba(0, 0, 0, 0.13))
    drop-shadow(0px 120px 64px rgba(0, 0, 0, 0.04));
  width: 43vw;
  max-width: 808px;
  object-fit: contain;
}

.zr_hpic_left {
  left: min(126px, 6.5vw);
  z-index: 15;
  width: 25%;
  height: 100%;
}

.zr_hpic_left img:first-child {
  margin-left: 21%;
  max-width: 414px;
}

.zr_hpic_left img:last-child {
  margin-top: 15%;
  margin-right: 15%;
  max-width: 414px;
}

.zr_hero_img_right {
  right: min(-7.7vw, 147px);
  bottom: -1.5rem;
  z-index: 5;
}

.zr_hero_img_right img {
  width: 28.5vw;
  max-width: 547px;
}

.zr_hero_img_left {
  bottom: -1.5rem;
  left: min(-9.5vw, 182px);
  z-index: 5;
}

.zr_hero_img_left img {
  width: 26vw;
  max-width: 502px;
}

#zr_hpic1,
#zr_hpic2,
#zr_hpic3,
#zr_hpic4,
#zr_hpic5 {
  transform: translate3d(0, 0, 0);
  will-change: transform;
}

/*pages card*/
.zr_pages {
  gap: 2rem;
  margin: 4rem 0;
}

.zr_pages_title p {
  font-size: 2rem;
  line-height: 180%;
}

.zr_pages_wrapper {
  flex-wrap: wrap;
  gap: 1rem;
  padding: 0 4rem;
  width: 100%;
  max-width: 1678px;
}

.zr_page_card {
  gap: 0.625rem;
  border-radius: 1rem;
  background-color: var(--sa3);
  padding: 1rem;
  width: 375.5px;
  height: 432.55px;
}

.zr_page_card p {
  padding: 0.5rem 0;
  width: 100%;
  line-height: 180%;
}

/*top cards*/

.zr_topCards_wrapper {
  padding-bottom: 1.25rem;
  width: 100%;
  height: auto;
}

.zr_tcards_box {
  margin: 0 60px;
  height: auto;
}

.zr_tcard_layOne {
  clip-path: polygon(0 60px, 50% 0, 100% 60px, 100% 100%, 0 100%);
  background: radial-gradient(
    114.79% 100.14% at 50% 0%,
    var(--sa5) 0%,
    rgba(199, 209, 220, 0) 100%
  );
  width: 100%;
  height: auto;
}

.zr_tcard_layTwo {
  gap: 2rem;
  clip-path: polygon(0 120px, 50% 0, 100% 120px, 100% 100%, 0 100%);
  margin: 0 3.75rem;
  background: radial-gradient(
    114.79% 100% at 50% 0%,
    var(--sa5) 0%,
    rgba(199, 209, 220, 0) 100%
  );

  padding: 7.5rem 3.75rem 0;
  height: auto;
}

.zr_tcards_cards {
  gap: 4rem;
  width: 100%;
  height: auto;
}

.zr_tcards_cards_title {
  color: var(--sa4);
  font-size: 1.5rem;
  line-height: 180%;
}

.zr_tcards_cardsBox {
  flex-wrap: wrap;
  gap: 2rem;
  width: 100%;
  height: auto;
}

.zr_tcards_cardsBox > div {
  gap: 2rem;
}

.zr_tcards_card_top,
.zr_tcards_card_bott {
  filter: drop-shadow(0px 4px 9px rgba(0, 0, 0, 0.07))
    drop-shadow(0px 16px 16px rgba(0, 0, 0, 0.0588))
    drop-shadow(0px 37px 22px rgba(0, 0, 0, 0.0314))
    drop-shadow(0px 65px 26px rgba(0, 0, 0, 0.0118));
  border-radius: 0.5rem;
  background-color: var(--sa3);
  width: 100%;
}

.zr_tcards_card_bott {
  max-height: 570px;
}

.zr_tcards_card_top img {
  height: 100%;
  object-fit: contain;
}

.zr_tcards_card_bottLeft img {
  align-self: center;
  width: 85%;
}

.zr_tcards_card_top p,
.zr_tcards_card_bott p {
  padding-right: 1rem;
  padding-bottom: 1rem;
  font-size: 1.5rem;
  line-height: 180%;
  text-align: right;
}

.zr_tcards_card_bott p {
  margin-top: -1rem;
}

.zr_tcards_card_bottCenter {
  background: radial-gradient(
    211.4% 61.32% at 50% 38.68%,
    var(--white) 0%,
    var(--sa6) 100%
  );
}

/*option slider*/
.zr_tcards_slider_box {
  filter: drop-shadow(0px 4px 9px rgba(0, 0, 0, 0.0706))
    drop-shadow(0px 16px 16px rgba(0, 0, 0, 0.0588))
    drop-shadow(0px 37px 22px rgba(0, 0, 0, 0.0314))
    drop-shadow(0px 65px 26px rgba(0, 0, 0, 0.0118));
  margin-bottom: 5.25rem;
  border-radius: 0.5rem;
  background-color: var(--sa3);
  padding: 1rem;
  width: 100%;
}

.zr_tcards_slider {
  cursor: grab;
  width: 100%;
  overflow: hidden;
  overflow: hidden;
  touch-action: pan-y;
  user-select: none;
  -webkit-user-select: none;
}

.zr_tcards_slider:active {
  cursor: grabbing;
}

.zr_tcards_slider::after {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 99;
  background: linear-gradient(
    -270deg,
    var(--sa3) 5%,
    rgba(248, 248, 247, 0) 50.48%
  );
  width: 15%;
  height: 100%;
  content: "";
}

.zr_tcards_slider::before {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 99;
  background: linear-gradient(
    270deg,
    var(--sa3) 5%,
    rgba(248, 248, 247, 0) 50.48%
  );
  width: 15%;
  height: 100%;
  content: "";
}

.zr_tcards_slide_box {
  position: relative;
  flex: 0 0 auto;
  flex-shrink: 0;
  clip-path: polygon(
    0 32px,
    50% 0,
    100% 32px,
    100% calc(100% - 32px),
    50% 100%,
    0 calc(100% - 32px)
  );
  margin: 0 2rem;
  background-color: var(--sa7);
  padding: 0 0.625rem;
  width: 332px;
  height: 653px;
  overflow: hidden;
  white-space: nowrap;
}

.zr_tcards_slide_box img {
  display: block;
  filter: drop-shadow(0px 6.36px 14.3px rgba(0, 0, 0, 0.0706))
    drop-shadow(0px 25.42px 25.42px rgba(0, 0, 0, 0.0588))
    drop-shadow(0px 58.79px 34.96px rgba(0, 0, 0, 0.0314))
    drop-shadow(0px 103.28px 41.31px rgba(0, 0, 0, 0.0118));
  border: 1px solid var(--white);
  border-radius: 0.5rem;
  width: 86.6%;
  object-fit: cover;
  pointer-events: none;
}

.zr_tcards_slider_box > p {
  padding: 0.5rem 0;
  font-size: 1.5rem;
  line-height: 3rem;
}

.zr_tcard_slider_wrapper {
  will-change: transform;
  width: max-content;
}

/*marquee tags*/
.zr_options_tag {
  margin-bottom: 4rem;
  overflow: hidden;
}

.zr_marquee img{
	width: auto !important;
}

.zr_marquee,
.zr_mq_top,
.zr_mq_bottom {
  gap: 2rem;
}

.zr_marquee {
  position: relative;
  overflow: hidden;
}

.zr_mq_top,
.zr_mq_bottom {
  display: inline-flex;
  flex-wrap: nowrap;
  justify-content: flex-start !important;
  cursor: grab;
  width: max-content;
  overflow: hidden;
}

.zr_mq_top:active,
.zr_mq_bottom:active {
  cursor: grabbing;
}

.mq_card {
  flex: 0 0 auto;
  align-items: center;
  gap: 1rem;
  filter: blur(25);
  border-radius: 32px;
  background-color: var(--sa8);
  padding: 0.5rem;
  height: 48px;
}

.mq_card p {
  color: var(--white);
  font-size: 1rem;
}

/*option seconed card*/
.zr_bottCards_wrapper {
  padding-bottom: 1.25rem;
  width: 100%;
  height: auto;
}

.zr_bcards_box {
  margin: 0 3.75rem;
  height: auto;
}

.zr_bcard_layOne {
  clip-path: polygon(0 60px, 50% 0, 100% 60px, 100% 100%, 0 100%);
  background: radial-gradient(
    120.95% 103.01% at 50% 0%,
    var(--sa9) 0%,
    rgba(244, 237, 229, 0) 100%
  );
  width: 100%;
  height: auto;
}

.zr_bcard_layTwo {
  gap: 2rem;
  clip-path: polygon(0 120px, 50% 0, 100% 120px, 100% 100%, 0 100%);
  margin: 0 3.75rem;
  background: radial-gradient(
    67.66% 103.26% at 50% 0%,
    var(--sa10) 0%,
    rgba(233, 218, 203, 0) 100%
  );
  padding: 7.5rem 3.75rem 5.125rem;
  height: auto;
}

.zr_bcards_cards {
  gap: 4rem;
  width: 100%;
  height: auto;
}

.zr_bcards_cards_title {
  color: var(--sa4);
  font-size: 1.5rem;
  line-height: 180%;
}

.zr_bcards_cardsBox {
  flex-wrap: wrap;
  gap: 2rem;
  width: 100%;
  height: auto;
}

.zr_bcards_cardsBox > div {
  gap: 2rem;
}

.zr_bcards_card_top,
.zr_bcards_card_bott {
  filter: drop-shadow(0px 4px 9px rgba(0, 0, 0, 0.07))
    drop-shadow(0px 16px 16px rgba(0, 0, 0, 0.0588))
    drop-shadow(0px 37px 22px rgba(0, 0, 0, 0.0314))
    drop-shadow(0px 65px 26px rgba(0, 0, 0, 0.0118));
  border-radius: 0.5rem;
  background-color: var(--sa3);
  width: 100%;
}

.zr_bcards_card_bott {
  max-height: 570px;
}

.zr_bcards_card_top img {
  height: 100%;
  object-fit: contain;
}

.zr_bcards_card_bottLeft img {
  align-self: center;
  width: 85%;
}

.zr_bcards_card_top p,
.zr_bcards_card_bott p {
  padding-right: 1rem;
  padding-bottom: 1rem;
  font-size: 1.5rem;
  line-height: 180%;
  text-align: right;
}

.zr_bcards_card_bott p {
  margin-top: -1rem;
}

.zr_bcards_card_bottCenter {
  background: radial-gradient(
    211.4% 61.32% at 50% 38.68%,
    var(--sa1) 0%,
    var(--sa2) 100%
  );
}

/*contact us form*/
.zr_contact_wrapper {
  align-items: end;
  margin-bottom: 6rem;
  width: 100%;
  height: 743px;
}

.zr_contact_box {
  margin: 0 7.5rem;
  padding: 4.438rem 4.375rem 3.688rem;
  width: 100%;
  height: 642px;
}

.zr_contact_box > * {
  z-index: 5;
}

.zr_contact_box::before {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 0;
  clip-path: polygon(
    100% 50%,
    calc(100% - 64px) 0,
    64px 0,
    0 50%,
    64px 100%,
    calc(100% - 64px) 100%
  );
  background: radial-gradient(
    50% 172.18% at 50% 50%,
    var(--white) 0%,
    var(--sa6) 100%
  );
  width: 100%;
  height: 100%;
  content: "";
}

.zr_icons_right {
  gap: 3.063rem;
  width: auto;
  height: auto;
}

.zr_form {
  width: 100%;
  height: auto;
}

.zr_icons_left {
  align-items: end;
  gap: 3.063rem;
  width: auto;
  height: auto;
}

.zr_conus_iconBox {
  width: 240px;
  height: 147px;
}

.zr_conus_iconBox img {
  width: 72px;
}

.zr_conus_iconBox p {
  width: 100%;
  font-size: 1rem;
  line-height: 2rem;
  text-align: center;
}

.zr_conus_form {
  transform: translateY(-172px);
  border: 5px solid var(--sa11);
  border-radius: 16px;
  background: linear-gradient(180deg, var(--sa12) 0%, var(--sa13) 100%);
  padding: 4rem 6.75rem;
  width: 650px;
  height: 520px;
}

.zr_ftitle {
  margin-bottom: 1rem;
  font-size: 2rem;
  line-height: 2.25rem;
  text-align: center;
}

.zr_fdesc {
  margin-bottom: 2rem;
  font-size: 1rem;
  line-height: 2rem;
  text-align: center;
}

.zr_conus_form form label {
  padding-right: 1rem;
  padding-bottom: 0.25rem;
  color: var(--sa14);
  font-size: 1rem;
  line-height: 1.25rem;
}

.zr_conus_form form input {
  margin-bottom: 1.5rem;
  box-shadow:
    0px 0px 0px 1px rgba(2, 44, 34, 0.13),
    0px 1px 2px 0px rgba(2, 44, 34, 0.08);
  border-radius: 12px;
  background-color: var(--white);
  padding-right: 1rem;
  width: 100%;
  height: 48px;
}

.zr_conus_form form input[type="submit"] {
  margin-top: 0.5rem;
  margin-bottom: 0;
  border-radius: 999px;
  background: var(--sa15) !important;
  padding-right: 0 !important;
  color: var(--white);
  font-family: "IRANYekanXFaNum", "Vazir" !important;
}
