.elementor-27 .elementor-element.elementor-element-3fb88c2{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:5px 5px;--row-gap:5px;--column-gap:5px;--margin-top:0px;--margin-bottom:20px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;--z-index:10000;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(max-width:767px){.elementor-27 .elementor-element.elementor-element-3fb88c2{--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}}/* Start custom CSS for html, class: .elementor-element-ba6d878 *//* =========================================================
   SABA BASIRI — INDEPENDENT NEUMORPHISM MENU
   ========================================================= */

.sb-menu-shell {
  --menu-bg: #EEF0F6;
  --menu-ink: #0E0D15;
  --menu-ink-soft: #182346;
  --menu-accent: #BFA8BA;
  --menu-accent-strong: #7C83AD;
  --menu-accent-text: #59618C;

  position: relative;
  z-index: 9999;

  width: 100%;

  direction: rtl;

  font-family: "SabaFont", Tahoma, sans-serif;
}


/* ---------------------------------------------------------
   Wrapper
   --------------------------------------------------------- */

.sb-menu-shell .sb-navwrap {
  position: relative;

  z-index: 9999;

  width: 100%;

  padding-inline: 24px;

  background: transparent !important;
}


/* ---------------------------------------------------------
   Navigation
   --------------------------------------------------------- */

.sb-menu-shell .sb-nav {
  position: relative;

  display: flex;
  align-items: center;

  direction: rtl;

  gap: 10px;

  width: 100%;
  max-width: 1160px;

  min-height: 68px;

  margin-inline: auto;

  padding-block: 10px;

  background: transparent !important;

  border: 0 !important;
  border-radius: 0 !important;

  box-shadow: none !important;

  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}


/* ---------------------------------------------------------
   Brand
   --------------------------------------------------------- */

.sb-menu-shell .sb-brand {
  display: inline-flex;
  align-items: center;

  gap: 10px;

  flex: none;

  color: var(--menu-ink) !important;

  font-size: 16px;
  font-weight: 800;

  line-height: 1;

  text-decoration: none !important;

  white-space: nowrap;
}


/* Logo */

.sb-menu-shell .sb-mark {
  display: grid;
  place-items: center;

  width: 42px;
  height: 42px;

  flex: none;

  overflow: hidden;

  border-radius: 14px;

  background: var(--menu-bg);

  box-shadow:
    5px 5px 11px rgba(151, 156, 177, .28),
    -5px -5px 11px rgba(255, 255, 255, .88);
}

.sb-menu-shell .sb-mark img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;

  border-radius: inherit;
}


/* ---------------------------------------------------------
   Desktop Links
   --------------------------------------------------------- */

.sb-menu-shell .sb-navlinks {
  display: flex;
  align-items: center;

  direction: rtl;

  gap: 2px;

  margin: 0;
}

.sb-menu-shell .sb-navlinks > a:not(.sb-mobile-cta) {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 40px;

  padding: 7px 13px;

  color: var(--menu-ink-soft) !important;

  border-radius: 12px;

  font-family: "SabaFont", Tahoma, sans-serif;

  font-size: 14px;
  font-weight: 650;

  line-height: 1;

  text-decoration: none !important;

  white-space: nowrap;

  transition:
    color .2s ease,
    background .2s ease,
    box-shadow .2s ease,
    transform .2s ease;
}

.sb-menu-shell .sb-navlinks > a:not(.sb-mobile-cta):hover {
  color: var(--menu-accent-text) !important;

  background: var(--menu-bg);

  box-shadow:
    inset 4px 4px 8px rgba(151, 156, 177, .18),
    inset -4px -4px 8px rgba(255, 255, 255, .80);
}


/* ---------------------------------------------------------
   Buttons
   --------------------------------------------------------- */

.sb-menu-shell .sb-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  gap: 8px;

  min-height: 44px;

  padding-inline: 20px;

  border: 0;
  border-radius: 999px;

  font-family: "SabaFont", Tahoma, sans-serif;

  font-size: 14px;
  font-weight: 750;

  line-height: 1;

  text-decoration: none !important;

  white-space: nowrap;

  transition:
    transform .22s ease,
    box-shadow .22s ease;
}

.sb-menu-shell .sb-btn-primary {
  color: #fff !important;

  background:
    linear-gradient(
      135deg,
      #182346,
      #29345E
    );

  box-shadow:
    7px 7px 15px rgba(151, 156, 177, .34),
    -7px -7px 15px rgba(255, 255, 255, .84);
}

.sb-menu-shell .sb-btn-primary:hover {
  color: #fff !important;

  transform: translateY(-2px);

  box-shadow:
    9px 9px 19px rgba(151, 156, 177, .38),
    -9px -9px 19px rgba(255, 255, 255, .90);
}


/* CTA دسکتاپ را به چپ هل بده */

.sb-menu-shell .sb-desktop-cta {
  margin-inline-start: auto;
}


/* CTA موبایل در دسکتاپ مخفی */

.sb-menu-shell .sb-mobile-cta {
  display: none !important;
}


/* ---------------------------------------------------------
   Burger
   --------------------------------------------------------- */

.sb-menu-shell .sb-burger {
  display: none;
  place-items: center;

  width: 44px;
  height: 44px;

  flex: none;

  margin-inline-start: auto;

  padding: 0;

  color: var(--menu-ink-soft);

  border: 0;
  border-radius: 13px;

  background: var(--menu-bg);

  box-shadow:
    5px 5px 10px rgba(151, 156, 177, .26),
    -5px -5px 10px rgba(255, 255, 255, .86);

  cursor: pointer;

  transition:
    box-shadow .2s ease,
    transform .2s ease;
}

.sb-menu-shell .sb-burger:hover {
  transform: translateY(-1px);
}

.sb-menu-shell .sb-burger:active {
  transform: none;

  box-shadow:
    inset 4px 4px 8px rgba(151, 156, 177, .22),
    inset -4px -4px 8px rgba(255, 255, 255, .84);
}

.sb-menu-shell .sb-burger svg {
  display: block;

  width: 22px;
  height: 22px;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 760px) {

  .sb-menu-shell .sb-navwrap {
    padding-inline: 14px;
  }


  .sb-menu-shell .sb-nav {
    min-height: 58px;

    padding-block: 8px;
  }


  /* CTA دسکتاپ مخفی */

  .sb-menu-shell .sb-desktop-cta {
    display: none !important;
  }


  /* لینک‌ها پیش‌فرض مخفی */

  .sb-menu-shell .sb-navlinks {
    display: none;
  }


  /* Burger نمایش داده شود */

  .sb-menu-shell .sb-burger {
    display: grid;
  }


  /* -----------------------------------------
     OPEN MENU
     ----------------------------------------- */

  .sb-menu-shell.sb-mobile-open .sb-navlinks {
    position: absolute;

    top: calc(100% + 10px);

    right: 0;
    left: 0;

    z-index: 99999;

    display: flex;

    flex-direction: column;
    align-items: stretch;

    gap: 5px;

    padding: 14px;

    border-radius: 20px;

    background: var(--menu-bg);

    box-shadow:
      12px 12px 27px rgba(151, 156, 177, .30),
      -12px -12px 27px rgba(255, 255, 255, .90);
  }


  .sb-menu-shell.sb-mobile-open
  .sb-navlinks > a:not(.sb-mobile-cta) {
    display: flex;

    justify-content: flex-start;

    width: 100%;

    min-height: 43px;

    padding: 10px 13px;

    border-radius: 11px;

    text-align: right;
  }


  /* CTA داخل منوی موبایل */

  .sb-menu-shell.sb-mobile-open .sb-mobile-cta {
    display: inline-flex !important;

    width: 100%;

    min-height: 46px;

    margin-top: 6px;

    justify-content: center;

    color: #fff !important;

    background:
      linear-gradient(
        135deg,
        #182346,
        #29345E
      );

    border-radius: 999px;

    box-shadow:
      6px 6px 14px rgba(151, 156, 177, .30),
      -6px -6px 14px rgba(255, 255, 255, .84);
  }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 640px) {

  .sb-menu-shell .sb-navwrap {
    padding-inline: 10px;
  }

  .sb-menu-shell .sb-brand {
    gap: 8px;

    font-size: 14px;
  }

  .sb-menu-shell .sb-mark {
    width: 36px;
    height: 36px;

    border-radius: 12px;
  }

}


/* =========================================================
   VERY SMALL MOBILE
   ========================================================= */

@media (max-width: 420px) {

  .sb-menu-shell .sb-brand {
    font-size: 13px;
  }

  .sb-menu-shell .sb-mark {
    width: 34px;
    height: 34px;
  }

  .sb-menu-shell .sb-burger {
    width: 40px;
    height: 40px;
  }

}/* End custom CSS */