.elementor-1703 .elementor-element.elementor-element-af5f737{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1703 .elementor-element.elementor-element-c704d9d{--display:flex;--gap:50px 50px;--row-gap:50px;--column-gap:50px;--border-radius:20px 20px 20px 20px;--padding-top:50px;--padding-bottom:50px;--padding-left:10px;--padding-right:10px;}.elementor-1703 .elementor-element.elementor-element-cf88eb8{text-align:center;}.elementor-1703 .elementor-element.elementor-element-cf88eb8 .elementor-heading-title{font-family:"VazirMatn", Sans-serif;font-size:45px;font-weight:700;line-height:1.5em;color:#FFFFFF;}.elementor-1703 .elementor-element.elementor-element-f15b420{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1703 .elementor-element.elementor-element-69b1231{text-align:justify;font-family:"VazirMatn", Sans-serif;}.elementor-widget .tippy-tooltip .tippy-content{text-align:center;}@media(max-width:767px){.elementor-1703 .elementor-element.elementor-element-cf88eb8 .elementor-heading-title{font-size:35px;}}/* Start custom CSS *//* شروع */
.box1002 {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  contain: paint;
  border-radius: 14px;
  border: 1px solid rgba(255, 204, 0, 0.3); /* تغییر به زرد نیمه‌شفاف */
  background-color: #0a0c0f;
  background-image:
    /* براکت چهار گوشه (۸ لایه) - زرد درخشان */
    linear-gradient(#ffcc00 0 0), linear-gradient(#ffcc00 0 0),
    linear-gradient(#ffcc00 0 0), linear-gradient(#ffcc00 0 0),
    linear-gradient(#ffcc00 0 0), linear-gradient(#ffcc00 0 0),
    linear-gradient(#ffcc00 0 0), linear-gradient(#ffcc00 0 0),
    /* نوار هشدار بالا و پایین - زرد سنسوری */
    repeating-linear-gradient(45deg, rgba(255, 204, 0, 0.45) 0 5px, rgba(255, 204, 0, 0) 5px 10px),
    repeating-linear-gradient(45deg, rgba(255, 204, 0, 0.45) 0 5px, rgba(255, 204, 0, 0) 5px 10px),
    /* نوارهای سنسور/ریداکشن */
    linear-gradient(rgba(255, 204, 0, .10) 0 0),
    linear-gradient(rgba(255, 204, 0, .07) 0 0),
    /* هاله و پایه زرد/طلایی */
    radial-gradient(130% 100% at 50% -10%, rgba(255, 204, 0, 0.14), transparent 55%),
    radial-gradient(100% 100% at 50% 120%, rgba(0,0,0,.75), transparent 60%),
    linear-gradient(160deg, #0b0e12, #14120a 55%, #0a0c10); /* بهینه‌سازی پس‌زمینه با تم طلایی تیره */
  background-repeat:
    no-repeat, no-repeat, no-repeat, no-repeat,
    no-repeat, no-repeat, no-repeat, no-repeat,
    repeat-x, repeat-x,
    no-repeat, no-repeat,
    no-repeat, no-repeat, no-repeat;
  background-size:
    20px 2px, 2px 20px, 20px 2px, 2px 20px,
    20px 2px, 2px 20px, 20px 2px, 2px 20px,
    100% 4px, 100% 4px,
    38% 10px, 24% 8px,
    100% 100%, 100% 100%, 100% 100%;
  background-position:
    10px 10px, 10px 10px,
    calc(100% - 10px) 10px, calc(100% - 10px) 10px,
    10px calc(100% - 10px), 10px calc(100% - 10px),
    calc(100% - 10px) calc(100% - 10px), calc(100% - 10px) calc(100% - 10px),
    0 0, 0 100%,
    18px 38%, 18px 58%,
    0 0, 0 0, 0 0;
  animation: alarm1002 4.5s ease-in-out infinite;
}

/* لایه ۱: شبکه‌ی نظارتی + خطوط CRT + خط‌کش لبه‌ها (با رنگ پایه زرد) */
.box1002::before {
  content: "";
  position: absolute;
  inset: -48px 0 0;
  z-index: 1;
  pointer-events: none;
  background-image:
    repeating-linear-gradient(to bottom, rgba(255,255,255,.035) 0 1px, transparent 1px 3px),
    repeating-linear-gradient(to bottom, rgba(255, 204, 0, 0.15) 0 1px, transparent 1px 48px),
    repeating-linear-gradient(to right,  rgba(255, 204, 0, 0.10) 0 1px, transparent 1px 48px),
    repeating-linear-gradient(to bottom, rgba(255, 204, 0, 0.35) 0 1px, transparent 1px 12px),
    repeating-linear-gradient(to bottom, rgba(255, 204, 0, 0.35) 0 1px, transparent 1px 12px);
  background-size: 100% 3px, 100% 48px, 48px 100%, 6px 12px, 6px 12px;
  background-position: 0 0, 0 0, 0 0, 0 0, 100% 0;
  background-repeat: repeat, repeat, repeat, repeat-y, repeat-y;
  will-change: translate, opacity;
  animation:
    gridDrift1002 7s linear infinite,
    gridBreath1002 3.4s ease-in-out infinite;
}

/* لایه ۲: نوار اسکن + پیش‌خطوط + گلیچ (با رنگ زرد و سفید درخشان) */
.box1002::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  mix-blend-mode: screen;
  transform-origin: 50% 0;
  background-image:
    linear-gradient(to bottom,
      transparent 0 6.4%,
      rgba(255, 204, 0, 0.18) 6.4% 6.8%,
      transparent 6.8% 8.4%,
      rgba(255, 204, 0, 0.30) 8.4% 8.8%,
      transparent 8.8% 100%),
    linear-gradient(to bottom,
      transparent 0%,
      rgba(255, 204, 0, 0.06) 5%,
      rgba(255, 204, 0, 0.28) 9.4%,
      rgba(255, 220, 100, 0.85) 10.4%,
      #ffffff 10.9%,
      rgba(255, 220, 100, 0.80) 11.4%,
      rgba(255, 204, 0, 0.25) 12.6%,
      transparent 16%);
  will-change: transform, translate, opacity;
  backface-visibility: hidden;
  animation:
    beamSweep1002 3.8s cubic-bezier(.5,0,.5,1) infinite,
    beamStretch1002 1.9s ease-in-out infinite,
    beamFlicker1002 .28s steps(2, end) infinite,
    glitch1002 5.5s linear infinite;
}

@keyframes alarm1002 {
  0%, 100% { box-shadow: inset 0 0 30px rgba(255, 204, 0, 0.05), 0 0 0 1px rgba(255, 204, 0, 0.05); }
  50%      { box-shadow: inset 0 0 60px rgba(255, 204, 0, 0.15), 0 0 18px rgba(255, 204, 0, 0.12); }
}

@keyframes gridDrift1002 {
  to { translate: 0 48px; }
}

@keyframes gridBreath1002 {
  0%, 100% { opacity: .55; }
  50%      { opacity: 1; }
}

@keyframes beamSweep1002 {
  from { transform: translate3d(0, -16%, 0); }
  to   { transform: translate3d(0, 100%, 0); }
}

@keyframes beamStretch1002 {
  0%, 100% { scale: 1 1; }
  50%      { scale: 1 1.12; }
}

@keyframes beamFlicker1002 {
  0%, 100% { opacity: 1; }
  50%      { opacity: .82; }
}

@keyframes glitch1002 {
  0%, 85%  { translate: 0 0; }
  86%      { translate: -5px 0; }
  87%      { translate: 6px 0; }
  88%      { translate: -3px 0; }
  89%, 100%{ translate: 0 0; }
}

@media (prefers-reduced-motion: reduce) {
  .box1002,
  .box1002::before,
  .box1002::after { animation: none; }
  .box1002::before { opacity: .7; }
  .box1002::after  { opacity: .25; }
}

/* پایان */

/* شروع */
/* استایل کلی باکس با پس‌زمینه جذاب (بدون انیمیشن هاور) */
.box1005 {
    position: relative;
    padding: 40px;
    border-radius: 25px;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
    background-image: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    overflow: hidden;
}

/* استایل تگ H2 در دسکتاپ */
.box1005 h2 {
    font-size: 32px;
    color: #ffffff;
    margin-bottom: 20px;
    font-weight: 900;
    text-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

/* استایل تگ H3 در دسکتاپ */
.box1005 h3 {
    font-size: 20px;
    color: #ffcc33;
    margin: 20px 0 10px;
}

/* استایل تگ P در دسکتاپ */
.box1005 p {
    font-size: 16px;
    color: rgba(255, 255, 255, 0.9);
    line-height: 1.8;
    margin-bottom: 0;
}

/* =======================================================
   ریسپانسیو: کدهای مخصوص تبلت (صفحه‌نمایش‌های کوچک‌تر از 1024px)
   ======================================================= */
@media (max-width: 1024px) {
    .box1005 {
        padding: 30px; /* کاهش فاصله داخلی */
    }
    
    .box1005 h2 {
        font-size: 26px; /* کاهش اندازه عنوان اصلی */
    }
    
    .box1005 h3 {
        font-size: 18px; /* کاهش اندازه زیرعنوان */
    }
    
    .box1005 p {
        font-size: 15px; /* کمی کوچک‌تر شدن متن بدنه */
    }
}

/* =======================================================
   ریسپانسیو: کدهای مخصوص موبایل (صفحه‌نمایش‌های کوچک‌تر از 767px)
   ======================================================= */
@media (max-width: 767px) {
    .box1005 {
        padding: 20px; /* بهینه‌سازی فاصله داخلی برای صفحه‌های کوچک */
        border-radius: 15px; /* کاهش ملایم گردی گوشه‌ها در موبایل */
    }
    
    .box1005 h2 {
        font-size: 22px; /* سایز کاملا مناسب و خوانا برای موبایل */
        margin-bottom: 15px;
    }
    
    .box1005 h3 {
        font-size: 16px;
        margin: 15px 0 8px;
    }
    
    .box1005 p {
        font-size: 14px; /* اندازه فونت استاندارد و خوانا برای متن‌های طولانی در موبایل */
        line-height: 1.7; /* کاهش جزئی فاصله خطوط متناسب با سایز جدید */
    }
}
/* =======================================================
   استایل تصاویر داخل باکس box1005
   ======================================================= */
.box1005 img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 20px auto; /* ایجاد فاصله در بالا و پایین عکس و وسط‌چین کردن آن */
    border-radius: 10px; /* لبه‌های گرد ملایم متناسب با باکس */
    border: 1px solid rgba(255, 204, 0, 0.2); /* مرز زرد بسیار ملایم دور عکس */
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3), 
                0 0 15px rgba(255, 204, 0, 0.05); /* هاله نوری زرد بسیار ضعیف */
    transition: border-color 0.3s ease, box-shadow 0.3s ease, filter 0.3s ease;
    filter: grayscale(10%) brightness(95%); /* هماهنگی بیشتر تصویر با تم دارک و سایبرپانک */
}

/* افکت بسیار ظریف نوری هنگام رفتن موس روی عکس (بدون جابه‌جایی و انیمیشن حرکتی) */
.box1005 img:hover {
    filter: grayscale(0%) brightness(100%);
    border-color: rgba(255, 204, 0, 0.6); /* درخشان‌تر شدن مرز زرد */
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4), 
                0 0 20px rgba(255, 204, 0, 0.2); /* درخشان‌تر شدن هاله زرد دور عکس */
}

/* ریسپانسیو کردن تصاویر در موبایل */
@media (max-width: 767px) {
    .box1005 img {
        margin: 15px auto; /* کاهش فاصله عمودی تصاویر در صفحات موبایل */
        max-width: 90%; /* کمی کوچک‌تر شدن عرض تصویر در موبایل برای زیبایی بیشتر */
    }
}

/* پایان *//* End custom CSS */