.elementor-11238 .elementor-element.elementor-element-a5f5547{--display:flex;--flex-direction:row-reverse;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap-reverse;}.elementor-11238 .elementor-element.elementor-element-a5f5547:not(.elementor-motion-effects-element-type-background), .elementor-11238 .elementor-element.elementor-element-a5f5547 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#00133D;}.elementor-11238 .elementor-element.elementor-element-3dcbec5{width:var( --container-widget-width, 21.262% );max-width:21.262%;--container-widget-width:21.262%;--container-widget-flex-grow:0;}.elementor-11238 .elementor-element.elementor-element-3dcbec5.elementor-element{--flex-grow:0;--flex-shrink:0;}/* Start custom CSS for html, class: .elementor-element-3dcbec5 */.mobile-card {
  width: 210px;
  background: var(--frame, #d1ca02);
  border-radius: 50px;
  box-shadow: 0 10px 32px 0 rgba(0,180,210,0.18);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 0 18px 0;
  position: relative;
  margin: 0 15px 38px 15px;
  overflow: visible;
  transition: box-shadow .32s cubic-bezier(.32,.1,.5,.96);
}

.mobile-card__special {
  color: #fff;
  font-weight: bold;
  font-size: 18px;
  padding: 14px 0 0 0;
  letter-spacing: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.star { font-size: 19px; margin-top: -3px; }

.mobile-card__frame {
  width: 186px;
  height: 380px;
  background: #d1ca02;
  border-radius: 22px;
  margin: 10px auto 0 auto;
  position: relative;
  overflow: hidden;
  box-shadow: 0 2px 12px 0 rgba(0,0,0,0.12);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

/* تصویر وبسایت با شادو و بلور رنگی */
.mobile-card__img {
  width: 100%;
  height: 78%;
  object-fit: cover;
  border-radius: 20px 20px 0 0;
  display: block;
  z-index: 2;
  transition: 
    filter .23s, 
    opacity .23s, 
    box-shadow .22s;
  box-shadow: 0 0 40px 9px var(--frame, #d1ca02), 0 0 0 8px #d1ca02 inset;
  filter: blur(1.6px) brightness(0.92) contrast(0.98);
  opacity: .93;
}

/* لایه اورلی هاور */
.mobile-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,170,255,0.11) 40%, transparent 100%);
  opacity: 0;
  z-index: 5;
  pointer-events: none;
  transition: opacity .2s;
}

/* لوگو بزرگ و شفاف */
.mobile-card__logo-wrap {
  position: absolute;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  width: 124px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 8;
  opacity: 1;
  filter: none;
  background: none;
  transition: filter .24s, opacity .17s, bottom .18s;
}
.mobile-card__logo {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 3px 15px rgba(20, 210, 210, 0.12));
  transition: filter .16s, opacity .15s;
}

/* فلش و برچسب دیواری */
.mobile-card__btn--left {
  position: absolute;
  top: 50%;
  left: -13px;
  transform: translateY(-50%);
  width: 52px;
  height: 48px;
  background: var(--frame, #d1ca02);
  border-radius: 0 36px 36px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 1px 12px 0 rgba(0,0,0,0.11);
  border: 2.2px solid #d1ca02;
  z-index: 10;
  opacity: 0;
  pointer-events: none;
  transition: 
    opacity .34s, 
    left .34s, 
    background .22s, 
    color .22s;
  font-size: 22px;
}
.mobile-card__arrow {
  font-size: 29px;
  color: #d1ca02;
  margin-left: 2px;
  font-weight: bold;
}

/* برچسب نام سایت عمودی */
.mobile-card__btn--right {
  position: absolute;
  top: 50%;
  right: -13px;
  transform: translateY(-50%);
  padding: 9px 10px;
  background: var(--frame, #12b5cc);
  font-size: 15px;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  border-radius: 0 0 13px 13px;
  font-weight: bold;
  letter-spacing: 1.2px;
  height: 82px;
  width: 33px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  box-shadow: 0 1px 10px 0 rgba(0,0,0,0.13);
  color: #fff;
  z-index: 10;
  opacity: 0;
  pointer-events: none;
  transition: 
    opacity .28s, 
    right .34s, 
    background .22s, 
    color .22s;
}

/* نقاط پایین کارت */
.mobile-card__dots {
  display: flex;
  gap: 10px;
  justify-content: center;
  margin: 20px 0 0 0;
}
.mobile-card__dots span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #fff;
  opacity: .86;
  display: block;
  box-shadow: 0 2px 8px #1ce6e618;
}

/* ---------------- حالت هاور ---------------- */
.mobile-card:hover {
  box-shadow: 0 24px 38px 0 rgba(10,100,210,0.19), 0 0 0 3.5px #d1ca02;
}
.mobile-card:hover .mobile-card__img {
  filter: none;
  opacity: 1;
  box-shadow: 0 0 0 0 transparent;
}
/* لوگو ناپدید و محو شود */
.mobile-card:hover .mobile-card__logo-wrap {
  opacity: 0;
  filter: blur(7px);
  pointer-events: none;
}
/* فلش و برچسب دیده شوند، پس‌زمینه سفید و متن آبی تیره */
.mobile-card:hover .mobile-card__btn--left,
.mobile-card:hover .mobile-card__btn--right {
  opacity: 1;
  pointer-events: auto;
  background: #d1ca02;
  color: #00133D !important;
  border-color: #fff;
}
/* فلش رنگ آبی تیره شود */
.mobile-card:hover .mobile-card__arrow {
  color: #00133D;
}
.mobile-card:hover .mobile-card__btn--left { left: -1px; }
.mobile-card:hover .mobile-card__btn--right { right: -1px; }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-95a8df0 */.mobile-card {
  width: 210px;
  background: var(--frame, #fff);
  border-radius: 28px;
  box-shadow: 0 10px 32px 0 rgba(0,180,210,0.18);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 0 18px 0;
  position: relative;
  margin: 0 15px 38px 15px;
  overflow: visible;
  transition: box-shadow .32s cubic-bezier(.32,.1,.5,.96);
}

.mobile-card__special {
  color: #fff;
  font-weight: bold;
  font-size: 18px;
  padding: 14px 0 0 0;
  letter-spacing: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.star { font-size: 19px; margin-top: -3px; }

.mobile-card__frame {
  width: 186px;
  height: 380px;
  background: #191828;
  border-radius: 22px;
  margin: 10px auto 0 auto;
  position: relative;
  overflow: hidden;
  box-shadow: 0 2px 12px 0 rgba(0,0,0,0.12);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

/* تصویر وبسایت با شادو و بلور رنگی */
.mobile-card__img {
  width: 100%;
  height: 78%;
  object-fit: cover;
  border-radius: 20px 20px 0 0;
  display: block;
  z-index: 2;
  transition: 
    filter .23s, 
    opacity .23s, 
    box-shadow .22s;
  box-shadow: 0 0 40px 9px var(--frame, #12b5cc), 0 0 0 8px #00133d15 inset;
  filter: blur(1.6px) brightness(0.92) contrast(0.98);
  opacity: .93;
}

/* لایه اورلی هاور */
.mobile-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,170,255,0.11) 40%, transparent 100%);
  opacity: 0;
  z-index: 5;
  pointer-events: none;
  transition: opacity .2s;
}

/* لوگو بزرگ و شفاف */
.mobile-card__logo-wrap {
  position: absolute;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  width: 124px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 8;
  opacity: 1;
  filter: none;
  background: none;
  transition: filter .24s, opacity .17s, bottom .18s;
}
.mobile-card__logo {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 3px 15px rgba(20, 210, 210, 0.12));
  transition: filter .16s, opacity .15s;
}

/* فلش و برچسب دیواری */
.mobile-card__btn--left {
  position: absolute;
  top: 50%;
  left: -13px;
  transform: translateY(-50%);
  width: 52px;
  height: 48px;
  background: var(--frame, #12b5cc);
  border-radius: 0 36px 36px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 1px 12px 0 rgba(0,0,0,0.11);
  border: 2.2px solid #fff;
  z-index: 10;
  opacity: 0;
  pointer-events: none;
  transition: 
    opacity .34s, 
    left .34s, 
    background .22s, 
    color .22s;
  font-size: 22px;
}
.mobile-card__arrow {
  font-size: 29px;
  color: #fff;
  margin-left: 2px;
  font-weight: bold;
}

/* برچسب نام سایت عمودی */
.mobile-card__btn--right {
  position: absolute;
  top: 50%;
  right: -13px;
  transform: translateY(-50%);
  padding: 9px 10px;
  background: var(--frame, #12b5cc);
  font-size: 15px;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  border-radius: 0 0 13px 13px;
  font-weight: bold;
  letter-spacing: 1.2px;
  height: 82px;
  width: 33px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  box-shadow: 0 1px 10px 0 rgba(0,0,0,0.13);
  color: #fff;
  z-index: 10;
  opacity: 0;
  pointer-events: none;
  transition: 
    opacity .28s, 
    right .34s, 
    background .22s, 
    color .22s;
}

/* نقاط پایین کارت */
.mobile-card__dots {
  display: flex;
  gap: 10px;
  justify-content: center;
  margin: 20px 0 0 0;
}
.mobile-card__dots span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #fff;
  opacity: .86;
  display: block;
  box-shadow: 0 2px 8px #1ce6e618;
}

/* ---------------- حالت هاور ---------------- */
.mobile-card:hover {
  box-shadow: 0 24px 38px 0 rgba(10,100,210,0.19), 0 0 0 3.5px #0ff3ff80;
}
.mobile-card:hover .mobile-card__img {
  filter: none;
  opacity: 1;
  box-shadow: 0 0 0 0 transparent;
}
/* لوگو ناپدید و محو شود */
.mobile-card:hover .mobile-card__logo-wrap {
  opacity: 0;
  filter: blur(7px);
  pointer-events: none;
}
/* فلش و برچسب دیده شوند، پس‌زمینه سفید و متن آبی تیره */
.mobile-card:hover .mobile-card__btn--left,
.mobile-card:hover .mobile-card__btn--right {
  opacity: 1;
  pointer-events: auto;
  background: #fff;
  color: #00133D !important;
  border-color: #fff;
}
/* فلش رنگ آبی تیره شود */
.mobile-card:hover .mobile-card__arrow {
  color: #00133D;
}
.mobile-card:hover .mobile-card__btn--left { left: -1px; }
.mobile-card:hover .mobile-card__btn--right { right: -1px; }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-e2e69bb */.mobile-card {
  width: 210px;
  background: var(--frame, #fff);
  border-radius: 28px;
  box-shadow: 0 10px 32px 0 rgba(0,180,210,0.18);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 0 18px 0;
  position: relative;
  margin: 0 15px 38px 15px;
  overflow: visible;
  transition: box-shadow .32s cubic-bezier(.32,.1,.5,.96);
}

.mobile-card__special {
  color: #fff;
  font-weight: bold;
  font-size: 18px;
  padding: 14px 0 0 0;
  letter-spacing: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.star { font-size: 19px; margin-top: -3px; }

.mobile-card__frame {
  width: 186px;
  height: 380px;
  background: #191828;
  border-radius: 22px;
  margin: 10px auto 0 auto;
  position: relative;
  overflow: hidden;
  box-shadow: 0 2px 12px 0 rgba(0,0,0,0.12);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

/* تصویر وبسایت با شادو و بلور رنگی */
.mobile-card__img {
  width: 100%;
  height: 78%;
  object-fit: cover;
  border-radius: 20px 20px 0 0;
  display: block;
  z-index: 2;
  transition: 
    filter .23s, 
    opacity .23s, 
    box-shadow .22s;
  box-shadow: 0 0 40px 9px var(--frame, #12b5cc), 0 0 0 8px #00133d15 inset;
  filter: blur(1.6px) brightness(0.92) contrast(0.98);
  opacity: .93;
}

/* لایه اورلی هاور */
.mobile-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,170,255,0.11) 40%, transparent 100%);
  opacity: 0;
  z-index: 5;
  pointer-events: none;
  transition: opacity .2s;
}

/* لوگو بزرگ و شفاف */
.mobile-card__logo-wrap {
  position: absolute;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  width: 124px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 8;
  opacity: 1;
  filter: none;
  background: none;
  transition: filter .24s, opacity .17s, bottom .18s;
}
.mobile-card__logo {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 3px 15px rgba(20, 210, 210, 0.12));
  transition: filter .16s, opacity .15s;
}

/* فلش و برچسب دیواری */
.mobile-card__btn--left {
  position: absolute;
  top: 50%;
  left: -13px;
  transform: translateY(-50%);
  width: 52px;
  height: 48px;
  background: var(--frame, #12b5cc);
  border-radius: 0 36px 36px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 1px 12px 0 rgba(0,0,0,0.11);
  border: 2.2px solid #fff;
  z-index: 10;
  opacity: 0;
  pointer-events: none;
  transition: 
    opacity .34s, 
    left .34s, 
    background .22s, 
    color .22s;
  font-size: 22px;
}
.mobile-card__arrow {
  font-size: 29px;
  color: #fff;
  margin-left: 2px;
  font-weight: bold;
}

/* برچسب نام سایت عمودی */
.mobile-card__btn--right {
  position: absolute;
  top: 50%;
  right: -13px;
  transform: translateY(-50%);
  padding: 9px 10px;
  background: var(--frame, #12b5cc);
  font-size: 15px;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  border-radius: 0 0 13px 13px;
  font-weight: bold;
  letter-spacing: 1.2px;
  height: 82px;
  width: 33px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  box-shadow: 0 1px 10px 0 rgba(0,0,0,0.13);
  color: #fff;
  z-index: 10;
  opacity: 0;
  pointer-events: none;
  transition: 
    opacity .28s, 
    right .34s, 
    background .22s, 
    color .22s;
}

/* نقاط پایین کارت */
.mobile-card__dots {
  display: flex;
  gap: 10px;
  justify-content: center;
  margin: 20px 0 0 0;
}
.mobile-card__dots span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #fff;
  opacity: .86;
  display: block;
  box-shadow: 0 2px 8px #1ce6e618;
}

/* ---------------- حالت هاور ---------------- */
.mobile-card:hover {
  box-shadow: 0 24px 38px 0 rgba(10,100,210,0.19), 0 0 0 3.5px #0ff3ff80;
}
.mobile-card:hover .mobile-card__img {
  filter: none;
  opacity: 1;
  box-shadow: 0 0 0 0 transparent;
}
/* لوگو ناپدید و محو شود */
.mobile-card:hover .mobile-card__logo-wrap {
  opacity: 0;
  filter: blur(7px);
  pointer-events: none;
}
/* فلش و برچسب دیده شوند، پس‌زمینه سفید و متن آبی تیره */
.mobile-card:hover .mobile-card__btn--left,
.mobile-card:hover .mobile-card__btn--right {
  opacity: 1;
  pointer-events: auto;
  background: #fff;
  color: #00133D !important;
  border-color: #fff;
}
/* فلش رنگ آبی تیره شود */
.mobile-card:hover .mobile-card__arrow {
  color: #00133D;
}
.mobile-card:hover .mobile-card__btn--left { left: -1px; }
.mobile-card:hover .mobile-card__btn--right { right: -1px; }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-363cfd6 */.mobile-card {
  width: 210px;
  background: var(--frame, #fff);
  border-radius: 28px;
  box-shadow: 0 10px 32px 0 rgba(0,180,210,0.18);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 0 18px 0;
  position: relative;
  margin: 0 15px 38px 15px;
  overflow: visible;
  transition: box-shadow .32s cubic-bezier(.32,.1,.5,.96);
}

.mobile-card__special {
  color: #fff;
  font-weight: bold;
  font-size: 18px;
  padding: 14px 0 0 0;
  letter-spacing: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.star { font-size: 19px; margin-top: -3px; }

.mobile-card__frame {
  width: 186px;
  height: 380px;
  background: #191828;
  border-radius: 22px;
  margin: 10px auto 0 auto;
  position: relative;
  overflow: hidden;
  box-shadow: 0 2px 12px 0 rgba(0,0,0,0.12);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

/* تصویر وبسایت با شادو و بلور رنگی */
.mobile-card__img {
  width: 100%;
  height: 78%;
  object-fit: cover;
  border-radius: 20px 20px 0 0;
  display: block;
  z-index: 2;
  transition: 
    filter .23s, 
    opacity .23s, 
    box-shadow .22s;
  box-shadow: 0 0 40px 9px var(--frame, #12b5cc), 0 0 0 8px #00133d15 inset;
  filter: blur(1.6px) brightness(0.92) contrast(0.98);
  opacity: .93;
}

/* لایه اورلی هاور */
.mobile-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,170,255,0.11) 40%, transparent 100%);
  opacity: 0;
  z-index: 5;
  pointer-events: none;
  transition: opacity .2s;
}

/* لوگو بزرگ و شفاف */
.mobile-card__logo-wrap {
  position: absolute;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  width: 124px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 8;
  opacity: 1;
  filter: none;
  background: none;
  transition: filter .24s, opacity .17s, bottom .18s;
}
.mobile-card__logo {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 3px 15px rgba(20, 210, 210, 0.12));
  transition: filter .16s, opacity .15s;
}

/* فلش و برچسب دیواری */
.mobile-card__btn--left {
  position: absolute;
  top: 50%;
  left: -13px;
  transform: translateY(-50%);
  width: 52px;
  height: 48px;
  background: var(--frame, #12b5cc);
  border-radius: 0 36px 36px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 1px 12px 0 rgba(0,0,0,0.11);
  border: 2.2px solid #fff;
  z-index: 10;
  opacity: 0;
  pointer-events: none;
  transition: 
    opacity .34s, 
    left .34s, 
    background .22s, 
    color .22s;
  font-size: 22px;
}
.mobile-card__arrow {
  font-size: 29px;
  color: #fff;
  margin-left: 2px;
  font-weight: bold;
}

/* برچسب نام سایت عمودی */
.mobile-card__btn--right {
  position: absolute;
  top: 50%;
  right: -13px;
  transform: translateY(-50%);
  padding: 9px 10px;
  background: var(--frame, #12b5cc);
  font-size: 15px;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  border-radius: 0 0 13px 13px;
  font-weight: bold;
  letter-spacing: 1.2px;
  height: 82px;
  width: 33px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  box-shadow: 0 1px 10px 0 rgba(0,0,0,0.13);
  color: #fff;
  z-index: 10;
  opacity: 0;
  pointer-events: none;
  transition: 
    opacity .28s, 
    right .34s, 
    background .22s, 
    color .22s;
}

/* نقاط پایین کارت */
.mobile-card__dots {
  display: flex;
  gap: 10px;
  justify-content: center;
  margin: 20px 0 0 0;
}
.mobile-card__dots span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #fff;
  opacity: .86;
  display: block;
  box-shadow: 0 2px 8px #1ce6e618;
}

/* ---------------- حالت هاور ---------------- */
.mobile-card:hover {
  box-shadow: 0 24px 38px 0 rgba(10,100,210,0.19), 0 0 0 3.5px #0ff3ff80;
}
.mobile-card:hover .mobile-card__img {
  filter: none;
  opacity: 1;
  box-shadow: 0 0 0 0 transparent;
}
/* لوگو ناپدید و محو شود */
.mobile-card:hover .mobile-card__logo-wrap {
  opacity: 0;
  filter: blur(7px);
  pointer-events: none;
}
/* فلش و برچسب دیده شوند، پس‌زمینه سفید و متن آبی تیره */
.mobile-card:hover .mobile-card__btn--left,
.mobile-card:hover .mobile-card__btn--right {
  opacity: 1;
  pointer-events: auto;
  background: #fff;
  color: #00133D !important;
  border-color: #fff;
}
/* فلش رنگ آبی تیره شود */
.mobile-card:hover .mobile-card__arrow {
  color: #00133D;
}
.mobile-card:hover .mobile-card__btn--left { left: -1px; }
.mobile-card:hover .mobile-card__btn--right { right: -1px; }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-edc8842 */.mobile-card {
  width: 210px;
  background: var(--frame, #fff);
  border-radius: 28px;
  box-shadow: 0 10px 32px 0 rgba(0,180,210,0.18);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 0 18px 0;
  position: relative;
  margin: 0 15px 38px 15px;
  overflow: visible;
  transition: box-shadow .32s cubic-bezier(.32,.1,.5,.96);
}

.mobile-card__special {
  color: #fff;
  font-weight: bold;
  font-size: 18px;
  padding: 14px 0 0 0;
  letter-spacing: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.star { font-size: 19px; margin-top: -3px; }

.mobile-card__frame {
  width: 186px;
  height: 380px;
  background: #191828;
  border-radius: 22px;
  margin: 10px auto 0 auto;
  position: relative;
  overflow: hidden;
  box-shadow: 0 2px 12px 0 rgba(0,0,0,0.12);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

/* تصویر وبسایت با شادو و بلور رنگی */
.mobile-card__img {
  width: 100%;
  height: 78%;
  object-fit: cover;
  border-radius: 20px 20px 0 0;
  display: block;
  z-index: 2;
  transition: 
    filter .23s, 
    opacity .23s, 
    box-shadow .22s;
  box-shadow: 0 0 40px 9px var(--frame, #12b5cc), 0 0 0 8px #00133d15 inset;
  filter: blur(1.6px) brightness(0.92) contrast(0.98);
  opacity: .93;
}

/* لایه اورلی هاور */
.mobile-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,170,255,0.11) 40%, transparent 100%);
  opacity: 0;
  z-index: 5;
  pointer-events: none;
  transition: opacity .2s;
}

/* لوگو بزرگ و شفاف */
.mobile-card__logo-wrap {
  position: absolute;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  width: 124px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 8;
  opacity: 1;
  filter: none;
  background: none;
  transition: filter .24s, opacity .17s, bottom .18s;
}
.mobile-card__logo {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 3px 15px rgba(20, 210, 210, 0.12));
  transition: filter .16s, opacity .15s;
}

/* فلش و برچسب دیواری */
.mobile-card__btn--left {
  position: absolute;
  top: 50%;
  left: -13px;
  transform: translateY(-50%);
  width: 52px;
  height: 48px;
  background: var(--frame, #12b5cc);
  border-radius: 0 36px 36px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 1px 12px 0 rgba(0,0,0,0.11);
  border: 2.2px solid #fff;
  z-index: 10;
  opacity: 0;
  pointer-events: none;
  transition: 
    opacity .34s, 
    left .34s, 
    background .22s, 
    color .22s;
  font-size: 22px;
}
.mobile-card__arrow {
  font-size: 29px;
  color: #fff;
  margin-left: 2px;
  font-weight: bold;
}

/* برچسب نام سایت عمودی */
.mobile-card__btn--right {
  position: absolute;
  top: 50%;
  right: -13px;
  transform: translateY(-50%);
  padding: 9px 10px;
  background: var(--frame, #12b5cc);
  font-size: 15px;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  border-radius: 0 0 13px 13px;
  font-weight: bold;
  letter-spacing: 1.2px;
  height: 82px;
  width: 33px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  box-shadow: 0 1px 10px 0 rgba(0,0,0,0.13);
  color: #fff;
  z-index: 10;
  opacity: 0;
  pointer-events: none;
  transition: 
    opacity .28s, 
    right .34s, 
    background .22s, 
    color .22s;
}

/* نقاط پایین کارت */
.mobile-card__dots {
  display: flex;
  gap: 10px;
  justify-content: center;
  margin: 20px 0 0 0;
}
.mobile-card__dots span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #fff;
  opacity: .86;
  display: block;
  box-shadow: 0 2px 8px #1ce6e618;
}

/* ---------------- حالت هاور ---------------- */
.mobile-card:hover {
  box-shadow: 0 24px 38px 0 rgba(10,100,210,0.19), 0 0 0 3.5px #0ff3ff80;
}
.mobile-card:hover .mobile-card__img {
  filter: none;
  opacity: 1;
  box-shadow: 0 0 0 0 transparent;
}
/* لوگو ناپدید و محو شود */
.mobile-card:hover .mobile-card__logo-wrap {
  opacity: 0;
  filter: blur(7px);
  pointer-events: none;
}
/* فلش و برچسب دیده شوند، پس‌زمینه سفید و متن آبی تیره */
.mobile-card:hover .mobile-card__btn--left,
.mobile-card:hover .mobile-card__btn--right {
  opacity: 1;
  pointer-events: auto;
  background: #fff;
  color: #00133D !important;
  border-color: #fff;
}
/* فلش رنگ آبی تیره شود */
.mobile-card:hover .mobile-card__arrow {
  color: #00133D;
}
.mobile-card:hover .mobile-card__btn--left { left: -1px; }
.mobile-card:hover .mobile-card__btn--right { right: -1px; }/* End custom CSS */