/* ── site-chrome.css (v2) ────────────────────────────────────────────
 * استایل مشترک هدر/فوتر/نوار تبلیغی — استخراج کامل از home.css طرح کارفرما
 * بازسازی: scripts/extract_site_chrome_v2.py — دستی ویرایش نکنید؛ بازتولید کنید.
 * اصلاح v2: قواعد پایهٔ دسکتاپ (.nav-card / .product-thumb / .product-name و …)
 * که در نسخهٔ قبل جا افتاده بود و هدر بلاگ/ادمین را می‌شکست.
 * ─────────────────────────────────────────────────────────────────── */

.promo-shell{
width:100%;
      padding:0 12px;
}
.promo{
height:60px;
      background:var(--promo);
      border-radius:0 0 22px 22px;
      position:relative;
      overflow:hidden;
}
.promo:before,
.promo:after{
content:"";
      position:absolute;
      width:170px;height:170px;border-radius:50%;
      background:rgba(255,255,255,.18);
      top:-95px;
}
.promo:before{
left:-85px
}
.promo:after{
right:-85px
}
.promo-inner{
width:min(1170px,calc(100% - 34px));
      height:100%;
      margin:auto;
      display:grid;
      grid-template-columns:190px 1fr;
      align-items:center;
      gap:18px;
      direction:ltr;
      position:relative;
      z-index:2;
}
.promo-product{
display:flex;
      align-items:center;
      gap:12px;
      direction:ltr;
}
.product-thumb{
width:72px;height:32px;border-radius:6px;
      background:#fff;
      box-shadow:0 5px 14px rgba(25,64,101,.07);
      position:relative;
}
.product-thumb:before{
content:"";
      position:absolute;left:9px;right:25px;top:7px;height:3px;
      background:#dce8f2;border-radius:3px
}
.product-thumb:after{
content:"";
      position:absolute;left:8px;right:8px;bottom:6px;height:7px;
      background:#63c4e9;border-radius:3px
}
.product-name{
font-weight:900;font-size:14px;color:#153b63;white-space:nowrap
}
.product-name b{
color:#0f79ef
}
.promo-text{
direction:rtl;
      text-align:center;
      font-size:13px;
      font-weight:700;
      color:#1f3853;
      line-height:1.8;
}
.promo-text strong{
color:#0968df;font-weight:900
}
.header-wrap{
width:var(--container);
      margin:13px auto 0;
      position:sticky;
      top:0;
      z-index:80;
      padding-bottom:12px;
      background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.82),rgba(255,255,255,0));
      backdrop-filter:blur(15px);
}
.header-row{
display:grid;
      grid-template-columns:410px 1fr;
      gap:14px;
      direction:ltr;
}
.header-card{
height:80px;
      background:#fff;
      border:1px solid var(--line);
      border-radius:19px;
      box-shadow:var(--shadow);
}
.actions-card{
grid-column:1;
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:0;
      isolation:isolate;
      padding:7px;
      direction:ltr;
      overflow:hidden;
}
.action{
min-width:0;
      border:0;
      outline:0;
      appearance:none;
      -webkit-appearance:none;
      background:transparent;
      box-shadow:none;
      border-radius:14px;
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      gap:4px;
      color:#3d4d63;
      font-size:9px;
      font-weight:700;
      line-height:1.45;
      transition:.2s ease;
      direction:rtl;
      padding:0;
}
.action:hover{
color:#1685f4;
      background:#f7fbff;
}
.action .ico{
width:36px;
      height:36px;
      display:grid;
      place-items:center;
      color:#34465d;
      margin:0 auto;
}
.action svg{
width:27px;
      height:27px;
      fill:none;
      stroke:currentColor;
      stroke-width:1.65;
      stroke-linecap:round;
      stroke-linejoin:round;
}
.action.login{
color:#fff;
      background:linear-gradient(145deg,#25a7ff,#1675f7);
      box-shadow:0 8px 18px rgba(22,117,247,.20);
}
.action.login:hover{
color:#fff;
      background:linear-gradient(145deg,#209bf2,#1268e8);
}
.action.login .ico{
color:#fff
}
.nav-card{
grid-column:2;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:24px;
      padding:0 24px;
      direction:rtl;
}
.brand{
display:flex;
      align-items:center;
      gap:12px;
      white-space:nowrap;
      flex:0 0 auto;
}
.brand-logo{
width:48px;height:48px;border-radius:15px;
      background:linear-gradient(145deg,#248dff,#1268e8);
      position:relative;
      box-shadow:0 10px 22px rgba(18,104,232,.2);
      overflow:hidden;
}
.brand-logo:before{
content:"";
      position:absolute;
      inset:10px;
      border:2px solid rgba(255,255,255,.96);
      border-radius:50%;
}
.brand-logo:after{
content:"";
      position:absolute;
      left:5px;right:5px;top:18px;height:10px;
      border:1.6px solid rgba(255,255,255,.95);
      border-radius:50%;
      transform:rotate(-25deg)
}
.brand-text{
text-align:right
}
.brand-text strong{
display:block;font-size:17px;line-height:1.25;font-weight:900;color:#16293f;
}
.brand-text small{
display:block;margin-top:2px;font-size:9px;color:#9aa5b3;
}
.menu{
display:flex;
      align-items:center;
      justify-content:center;
      gap:42px;
      flex:1;
      direction:rtl;
      font-size:12px;
      font-weight:700;
      color:#526075;
}
.menu a{
white-space:nowrap;
      position:relative;
      padding:29px 0;
      transition:.2s;
      color:#12233C; /* مثل هدر صفحهٔ اصلی — درخواست کارفرما: لینک آبی نباشد */
}
.menu a:hover{
color:#1685f4
}
.menu a:after{
content:"";
      position:absolute;
      left:50%;right:50%;bottom:17px;height:2px;
      background:#1685f4;border-radius:10px;transition:.2s
}
.menu a:hover:after{
left:0;right:0
}
.s1{
left:15%; top:180px; transform:rotate(-8deg); animation:serviceFloatA 5.3s ease-in-out infinite
}
.s2{
left:9%; top:290px; transform:rotate(-5deg); animation:serviceFloatB 5.8s ease-in-out infinite
}
.s3{
left:16%; top:412px; transform:rotate(6deg); animation:serviceFloatC 5.1s ease-in-out infinite
}
.s4{
left:24%; top:520px; transform:rotate(-4deg); animation:serviceFloatA 5.6s ease-in-out infinite
}
.cta-copy{
position:relative;
      z-index:2;
      text-align:right;
      max-width:760px;
}
.cta-copy .mini{
display:inline-flex;
      min-height:29px;
      align-items:center;
      padding:0 11px;
      border-radius:999px;
      background:rgba(255,255,255,.14);
      border:1px solid rgba(255,255,255,.22);
      font-size:10px;
      font-weight:900;
      margin-bottom:8px;
}
.cta-btn{
position:relative;
      z-index:2;
      height:50px;
      padding:0 22px;
      border-radius:16px;
      background:#fff;
      color:#176fe9;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:8px;
      font-size:12px;
      font-weight:900;
      box-shadow:0 14px 28px rgba(7,51,125,.15);
      flex:0 0 auto;
      transition:.2s ease;
}
.cta-btn:hover{
transform:translateY(-3px)
}
.cta-float{
position:absolute;
      width:58px;height:58px;
      border-radius:18px;
      background:rgba(255,255,255,.13);
      border:1px solid rgba(255,255,255,.2);
      display:grid;place-items:center;
      font-size:24px;
      animation:ctaFloat 5.5s ease-in-out infinite;
      z-index:1;
}
.cf1{
top:18px;left:34%;animation-delay:-1s
}
.cf2{
bottom:15px;right:36%;animation-delay:-2.4s
}
.site-footer{
background:#eef0f3;
      padding:0;
      position:relative;
}
.footer-main{
width:var(--container);
      margin:-6px auto 0;
      display:grid;
      grid-template-columns:1.15fr .8fr .8fr .9fr;
      gap:42px;
      padding:22px 10px 42px;
      direction:rtl;
}
.footer-col{
text-align:right;
}
.footer-col h4{
margin:0 0 18px;
      font-size:17px;
      color:#1e2938;
      font-weight:900;
}
.footer-col p,
.footer-col li,
.footer-col a{
color:#4c5868;
      font-size:12px;
      line-height:2;
}
.footer-col ul{
list-style:none;
      padding:0;
      margin:0;
}
.social-row{
display:flex;
      gap:9px;
      margin-top:14px;
}
.social{
width:36px;height:36px;
      display:grid;place-items:center;
      color:#fff;
      border-radius:2px;
      font-size:12px;
      font-weight:900;
}
.social.s1{
background:#4267a9
}
.social.s2{
background:#42bfe7
}
.social.s3{
background:#df695d
}
.social.s4{
background:#4eb6d5
}
.licenses{
width:var(--container);
      margin:0 auto;
      display:flex;
      align-items:center;
      gap:18px;
      padding:14px 8px 34px;
      direction:rtl;
}
.licenses h4{
margin:0 0 0 12px;
      font-size:18px;
      color:#2c3846;
      flex:0 0 auto;
}
.license-card{
width:180px;
      height:66px;
      border:1px solid #9caeca;
      border-radius:12px;
      background:#fff;
      display:grid;
      place-items:center;
      font-size:11px;
      color:#52637b;
      font-weight:900;
}
.footer-copybar{
min-height:54px;
      border-top:1px solid #8ea0ba;
      display:flex;
      align-items:center;
      justify-content:center;
      color:#3c4655;
      font-size:12px;
      background:#eef0f3;
      text-align:center;
      padding:0 70px;
}
.back-top{
position:absolute;
      left:28px;
      bottom:14px;
      width:46px;height:46px;border-radius:50%;
      border:2px solid #147cf8;
      background:#fff;
      color:#147cf8;
      display:grid;place-items:center;
      font-size:20px;
      font-weight:900;
      cursor:pointer;
}
.site-footer{
background:#fff;
      padding:0;
      position:relative;
}
.footer-cta-holder{
width:var(--container);
      margin:0 auto 28px;
}
.footer-cta{
position:relative;
      overflow:hidden;
      background:linear-gradient(135deg,#1b7cff,#2f88ff);
      border-radius:34px;
      min-height:182px;
      padding:34px 42px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:28px;
      box-shadow:0 18px 40px rgba(23,114,248,.14);
      color:#fff;
      isolation:isolate;
}
.footer-cta::before,
.footer-cta::after{
content:"";
      position:absolute;
      border-radius:50%;
      background:rgba(255,255,255,.10);
      z-index:-1;
}
.footer-cta::before{
width:220px;height:220px;left:-54px;bottom:-100px;
}
.footer-cta::after{
width:180px;height:180px;right:-30px;top:-70px;
}
.footer-cta .cta-copy{
max-width:760px;
      text-align:right;
      margin-right:auto;
}
.footer-cta .mini{
display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:32px;
      padding:0 14px;
      border-radius:999px;
      background:rgba(255,255,255,.16);
      border:1px solid rgba(255,255,255,.16);
      font-size:11px;
      font-weight:900;
      margin-bottom:12px;
}
.footer-cta h3{
margin:0 0 12px;
      font-size:clamp(27px,3.2vw,36px);
      line-height:1.45;
      font-weight:900;
}
.footer-cta p{
margin:0;
      font-size:14px;
      line-height:2;
      color:rgba(255,255,255,.92);
}
.footer-cta .cta-btn{
flex:0 0 auto;
      min-width:150px;
      height:50px;
      border-radius:16px;
      background:#fff;
      color:#1673f8;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      padding:0 22px;
      font-size:14px;
      font-weight:900;
      box-shadow:0 12px 26px rgba(11,53,123,.18);
}
.footer-cta .cta-float{
position:absolute;
      display:grid;
      place-items:center;
      border-radius:18px;
      color:#fff;
      background:rgba(255,255,255,.10);
      border:1px solid rgba(255,255,255,.12);
      backdrop-filter:blur(2px);
      animation:ctaFloatStep31 6.2s ease-in-out infinite;
}
.footer-cta .cf1{
top:14px;
      left:34%;
      width:56px;
      height:56px;
      font-size:18px;
}
.footer-cta .cf2{
right:36%;
      bottom:20px;
      width:48px;
      height:48px;
      font-size:19px;
      animation-delay:-2.4s;
}
.footer-main{
width:var(--container);
      margin:0 auto;
      display:grid;
      grid-template-columns:1.15fr .8fr .8fr .9fr;
      gap:42px;
      padding:16px 10px 38px;
      direction:rtl;
}
.licenses{
width:var(--container);
      margin:0 auto;
      display:grid;
      grid-template-columns:170px repeat(4, minmax(0,1fr));
      align-items:center;
      gap:18px;
      padding:10px 8px 30px;
      direction:rtl;
}
.licenses h4{
margin:0;
      font-size:18px;
      color:#2c3846;
      justify-self:start;
      text-align:right;
}
.license-card{
width:100%;
      min-width:0;
      height:70px;
      border:1px solid #9caeca;
      border-radius:16px;
      background:#fff;
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:12px;
      color:#52637b;
      font-weight:900;
      box-sizing:border-box;
}
.footer-copybar{
background:#fff;
      border-top:1px solid #e2e8f2;
      min-height:58px;
}
.back-top{
bottom:16px;
}
.s1{
left:11%; top:160px; transform:rotate(-9deg); animation:serviceFloatA 5.3s ease-in-out infinite
}
.s2{
left:5%; top:300px; transform:rotate(4deg); animation:serviceFloatB 6.1s ease-in-out infinite
}
.s3{
left:14%; top:430px; transform:rotate(-5deg); animation:serviceFloatC 5.4s ease-in-out infinite
}
.s4{
left:28%; top:520px; transform:rotate(6deg); animation:serviceFloatA 5.9s ease-in-out infinite
}
.footer-cta{
direction:rtl;
      padding:34px 42px;
}
.footer-cta .cta-copy{
order:1;
      margin:0;
      max-width:820px;
      text-align:right;
      margin-left:auto;
}
.footer-cta .cta-btn{
order:2;
      margin-right:auto;
      margin-left:0;
}
.footer-cta .cf1{
left:34%;
      top:16px;
}
.footer-cta .cf2{
right:42%;
      bottom:14px;
}
.footer-col:first-child .social-row{
justify-content:center;
      align-items:center;
      width:100%;
      margin:16px auto 0;
      animation:none !important;
      transform:none !important;
}
.footer-col:first-child .social{
animation:none !important;
      transform:none !important;
      transition:none !important;
}
.s1{
left:3.5%; top:145px; transform:rotate(-8deg); animation:serviceFloatA 5.3s ease-in-out infinite
}
.s2{
left:8.5%; top:300px; transform:rotate(4deg); animation:serviceFloatB 6.1s ease-in-out infinite
}
.s3{
left:16%; top:415px; transform:rotate(-5deg); animation:serviceFloatC 5.4s ease-in-out infinite
}
.s4{
left:25%; top:330px; transform:rotate(7deg); animation:serviceFloatA 5.9s ease-in-out infinite
}
.s1{
left:3%; top:148px; transform:rotate(-8deg); animation:serviceFloatA 5.3s ease-in-out infinite
}
.s2{
left:5.5%; top:302px; transform:rotate(4deg); animation:serviceFloatB 6.1s ease-in-out infinite
}
.s3{
left:13%; top:432px; transform:rotate(-6deg); animation:serviceFloatC 5.4s ease-in-out infinite
}
.s4{
left:22%; top:408px; transform:rotate(7deg); animation:serviceFloatA 5.9s ease-in-out infinite
}
.s1{
left:2.5% !important; top:135px !important; right:auto !important
}
.s2{
left:5.5% !important; top:292px !important; right:auto !important
}
.s3{
left:12.5% !important; top:430px !important; right:auto !important
}
.s4{
left:20.5% !important; top:350px !important; right:auto !important
}
.s1{
left:2.2% !important; top:130px !important; right:auto !important;
}
.s2{
left:4.8% !important; top:288px !important; right:auto !important;
}
.s3{
left:11.2% !important; top:404px !important; right:auto !important;
}
.s4{
left:17.2% !important; top:192px !important; right:auto !important;
}
.mobile-menu-toggle{
display:none;
      appearance:none;
      -webkit-appearance:none;
      border:0;
      background:transparent;
      padding:0;
      cursor:pointer;
}
.footer-main .footer-col:first-child > p{
text-align:justify !important;
      text-align-last:right !important;
      direction:rtl !important;
      line-height:2.05 !important;
}

@media(max-width:1000px){
  .s1{
  left:15%; top:220px
  }
  .s2{
  left:10%; top:340px
  }
  .s3{
  left:15%; top:470px
  }
  .s4{
  right:15%; top:220px
  }
}

@media (max-width:980px){
  .header-row{
  grid-template-columns:340px 1fr
  }
  .menu{
  gap:22px
  }
  .promo-product{
  display:none
  }
  .header-row{
  grid-template-columns:340px 1fr
  }
  .menu{
  gap:22px
  }
  .promo-product{
  display:none
  }
  .header-row{
  grid-template-columns:340px 1fr
  }
  .menu{
  gap:22px
  }
  .promo-product{
  display:none
  }
  .header-row{
  grid-template-columns:340px 1fr
  }
  .menu{
  gap:22px
  }
  .promo-product{
  display:none
  }
}

@media (max-width:860px){
  .header-row{
  grid-template-columns:1fr;
          direction:rtl;
  }
  .nav-card{
  grid-column:1;grid-row:1
  }
  .actions-card{
  grid-column:1;grid-row:2
  }
  .menu{
  display:none
  }
  .header-row{
  grid-template-columns:1fr;
          direction:rtl;
  }
  .nav-card{
  grid-column:1;grid-row:1
  }
  .actions-card{
  grid-column:1;grid-row:2
  }
  .menu{
  display:none
  }
  .header-row{
  grid-template-columns:1fr;
          direction:rtl;
  }
  .nav-card{
  grid-column:1;grid-row:1
  }
  .actions-card{
  grid-column:1;grid-row:2
  }
  .menu{
  display:none
  }
  .header-row{
  grid-template-columns:1fr;
          direction:rtl;
  }
  .nav-card{
  grid-column:1;grid-row:1
  }
  .actions-card{
  grid-column:1;grid-row:2
  }
  .menu{
  display:none
  }
  .header-row{
  grid-template-columns:1fr !important;
          direction:rtl !important;
  }
  .nav-card{
  grid-column:1 !important;
          grid-row:1 !important;
  }
  .actions-card{
  position:fixed !important;
          left:50% !important;
          right:auto !important;
          bottom:12px !important;
          top:auto !important;
          transform:translateX(-50%) !important;
          width:min(calc(100% - 20px),520px) !important;
          height:72px !important;
          z-index:1200 !important;
          grid-column:auto !important;
          grid-row:auto !important;
          display:grid !important;
          grid-template-columns:repeat(3,1fr) !important;
          padding:6px !important;
          border-radius:20px !important;
          background:rgba(255,255,255,.97) !important;
          border:1px solid #dfe8f5 !important;
          box-shadow:0 16px 42px rgba(29,70,130,.18) !important;
          backdrop-filter:blur(16px) !important;
          -webkit-backdrop-filter:blur(16px) !important;
          overflow:hidden !important;
  }
  .actions-card,
  .actions-card.mobile-bottom-mounted{
  position:fixed !important;
          left:50% !important;
          right:auto !important;
          top:auto !important;
          bottom:10px !important;
          transform:translateX(-50%) !important;
          width:min(calc(100% - 18px),520px) !important;
          height:72px !important;
          z-index:9999 !important;
          display:grid !important;
          grid-template-columns:repeat(3,1fr) !important;
          padding:6px !important;
          border-radius:20px !important;
          background:rgba(255,255,255,.98) !important;
          border:1px solid #dfe8f5 !important;
          box-shadow:0 16px 42px rgba(29,70,130,.18) !important;
          backdrop-filter:blur(16px) !important;
          -webkit-backdrop-filter:blur(16px) !important;
          overflow:hidden !important;
  }
}

@media(max-width:760px){
  .s1{
  animation-delay:0s!important
  }
  .s2{
  animation-delay:-.6s!important
  }
  .s3{
  animation-delay:-1.2s!important
  }
  .s4{
  animation-delay:-1.8s!important
  }
}

@media (max-width:620px){
  .promo-shell{
  padding:0 7px
  }
  .promo{
  height:54px;border-radius:0 0 16px 16px
  }
  .promo-inner{
  width:calc(100% - 20px);
          grid-template-columns:1fr;
  }
  .promo-text{
  font-size:9.5px
  }
  .header-wrap{
  margin-top:9px
  }
  .header-card{
  height:68px;border-radius:15px
  }
  .nav-card{
  padding:0 14px
  }
  .brand-logo{
  width:42px;height:42px
  }
  .brand-text strong{
  font-size:14px
  }
  .brand-text small{
  display:none
  }
  .actions-card{
  padding:5px
  }
  .action{
  font-size:8.5px;border-radius:12px
  }
  .action .ico{
  width:29px;height:29px
  }
  .action svg{
  width:23px;height:23px
  }
  .promo-shell{
  padding:0 7px
  }
  .promo{
  height:54px;border-radius:0 0 16px 16px
  }
  .promo-inner{
  width:calc(100% - 20px);
          grid-template-columns:1fr;
  }
  .promo-text{
  font-size:9.5px
  }
  .header-wrap{
  margin-top:9px
  }
  .header-card{
  height:68px;border-radius:15px
  }
  .nav-card{
  padding:0 14px
  }
  .brand-logo{
  width:42px;height:42px
  }
  .brand-text strong{
  font-size:14px
  }
  .brand-text small{
  display:none
  }
  .actions-card{
  padding:5px
  }
  .action{
  font-size:8.5px;border-radius:12px
  }
  .action .ico{
  width:29px;height:29px
  }
  .action svg{
  width:23px;height:23px
  }
  .promo-shell{
  padding:0 7px
  }
  .promo{
  height:54px;border-radius:0 0 16px 16px
  }
  .promo-inner{
  width:calc(100% - 20px);
          grid-template-columns:1fr;
  }
  .promo-text{
  font-size:9.5px
  }
  .header-wrap{
  margin-top:9px
  }
  .header-card{
  height:68px;border-radius:15px
  }
  .nav-card{
  padding:0 14px
  }
  .brand-logo{
  width:42px;height:42px
  }
  .brand-text strong{
  font-size:14px
  }
  .brand-text small{
  display:none
  }
  .actions-card{
  padding:5px
  }
  .action{
  font-size:8.5px;border-radius:12px
  }
  .action .ico{
  width:29px;height:29px
  }
  .action svg{
  width:23px;height:23px
  }
  .promo-shell{
  padding:0 7px
  }
  .promo{
  height:54px;border-radius:0 0 16px 16px
  }
  .promo-inner{
  width:calc(100% - 20px);
          grid-template-columns:1fr;
  }
  .promo-text{
  font-size:9.5px
  }
  .header-wrap{
  margin-top:9px
  }
  .header-card{
  height:68px;border-radius:15px
  }
  .nav-card{
  padding:0 14px
  }
  .brand-logo{
  width:42px;height:42px
  }
  .brand-text strong{
  font-size:14px
  }
  .brand-text small{
  display:none
  }
  .actions-card{
  padding:5px
  }
  .action{
  font-size:8.5px;border-radius:12px
  }
  .action .ico{
  width:29px;height:29px
  }
  .action svg{
  width:23px;height:23px
  }
  .actions-card{
  width:calc(100% - 18px) !important;
          height:70px !important;
          bottom:9px !important;
          border-radius:18px !important;
          padding:5px !important;
  }
  .actions-card .action{
  font-size:8.5px !important;
  }
  .actions-card .action .ico{
  width:30px !important;
          height:30px !important;
  }
  .actions-card .action.login{
  border-radius:14px !important;
  }
  .actions-card,
  .actions-card.mobile-bottom-mounted{
  width:calc(100% - 18px) !important;
          height:70px !important;
          bottom:9px !important;
          border-radius:18px !important;
          padding:5px !important;
  }
}

@media(max-width:980px){
  .footer-main{
  grid-template-columns:repeat(2,1fr)
  }
  .licenses{
  flex-wrap:wrap
  }
  .footer-cta{
  padding:28px 24px;
  }
  .footer-cta .cf1{
  left:16px
  }
  .footer-cta .cf2{
  right:16px
  }
  .footer-main{
  grid-template-columns:repeat(2,1fr)
  }
  .licenses{
  grid-template-columns:repeat(2,1fr)
  }
  .licenses h4{
  grid-column:1/-1;justify-self:start
  }
}

@media(max-width:620px){
  .cta-copy{
  text-align:center
  }
  .cta-btn{
  margin-top:18px
  }
  .cta-float{
  display:none
  }
  .footer-main{
  grid-template-columns:1fr;gap:22px
  }
  .licenses{
  display:grid;
          grid-template-columns:repeat(2,1fr);
  }
  .licenses h4{
  grid-column:1/-1
  }
  .license-card{
  width:100%
  }
  .footer-copybar{
  padding:10px 70px 10px 18px
  }
  .footer-cta-holder{
  margin-bottom:20px
  }
  .footer-cta{
  display:block;
          text-align:center;
          padding:28px 18px;
          border-radius:28px;
  }
  .footer-cta .cta-copy{
  text-align:center;
          max-width:none;
  }
  .footer-cta .cta-btn{
  margin-top:18px;
  }
  .footer-cta .cta-float{
  display:none;
  }
  .footer-main{
  grid-template-columns:1fr;gap:22px
  }
  .licenses{
  grid-template-columns:repeat(2,1fr);gap:14px
  }
  .license-card{
  height:68px
  }
  .footer-copybar{
  padding:10px 70px 10px 18px
  }
  .footer-cta{
  display:flex;
          flex-direction:column;
          text-align:center;
  }
  .footer-cta .cta-copy{
  text-align:center;
          margin:0;
  }
  .footer-cta .cta-btn{
  margin:18px auto 0;
  }
  .nav-card{
  padding:0 58px !important;
  }
  .mobile-menu-toggle{
  right:12px !important;
          width:40px !important;
          height:40px !important;
          border-radius:12px !important;
  }
  .nav-card .brand{
  gap:9px !important;
  }
  .nav-card .brand-logo{
  width:42px !important;
          height:42px !important;
  }
  .nav-card .brand-text strong{
  font-size:14px !important;
  }
  .footer-main .footer-col:first-child > p{
  text-align:justify !important;
          text-align-last:right !important;
  }
}

@media(max-width:1100px){
  .s4{
  left:17% !important
  }
}

@media(max-width:860px){
  .nav-card{
  position:relative !important;
          display:flex !important;
          align-items:center !important;
          justify-content:center !important;
          padding:0 64px !important;
          overflow:visible !important;
          z-index:1100 !important;
  }
  .nav-card .brand{
  position:absolute !important;
          left:50% !important;
          top:50% !important;
          transform:translate(-50%,-50%) !important;
          display:flex !important;
          align-items:center !important;
          justify-content:center !important;
          flex-direction:row !important;
          gap:10px !important;
          margin:0 !important;
          white-space:nowrap !important;
          z-index:2 !important;
  }
  .nav-card .brand-text{
  text-align:center !important;
  }
  .mobile-menu-toggle{
  display:flex !important;
          position:absolute !important;
          right:14px !important;
          left:auto !important;
          top:50% !important;
          transform:translateY(-50%) !important;
          width:42px !important;
          height:42px !important;
          border-radius:13px !important;
          background:#f5f9ff !important;
          border:1px solid #dfe9f7 !important;
          flex-direction:column !important;
          align-items:center !important;
          justify-content:center !important;
          gap:5px !important;
          z-index:4 !important;
          box-shadow:0 6px 16px rgba(28,77,140,.06) !important;
  }
  .mobile-menu-toggle span{
  display:block !important;
          width:20px !important;
          height:2px !important;
          border-radius:99px !important;
          background:#203650 !important;
          transition:transform .28s ease, opacity .2s ease, width .25s ease !important;
          transform-origin:center !important;
  }
  .nav-card.menu-open .mobile-menu-toggle span:nth-child(1){
  transform:translateY(7px) rotate(45deg) !important;
  }
  .nav-card.menu-open .mobile-menu-toggle span:nth-child(2){
  opacity:0 !important;
          width:0 !important;
  }
  .nav-card.menu-open .mobile-menu-toggle span:nth-child(3){
  transform:translateY(-7px) rotate(-45deg) !important;
  }
  .nav-card .menu{
  display:flex !important;
          position:absolute !important;
          top:calc(100% + 10px) !important;
          right:0 !important;
          left:0 !important;
          width:100% !important;
          min-width:0 !important;
          padding:10px !important;
          margin:0 !important;
          background:rgba(255,255,255,.98) !important;
          border:1px solid #dfe8f5 !important;
          border-radius:18px !important;
          box-shadow:0 18px 42px rgba(29,70,130,.15) !important;
          backdrop-filter:blur(16px) !important;
          -webkit-backdrop-filter:blur(16px) !important;
          flex-direction:column !important;
          align-items:stretch !important;
          justify-content:flex-start !important;
          gap:2px !important;
          direction:rtl !important;
          opacity:0 !important;
          visibility:hidden !important;
          pointer-events:none !important;
          transform:translateY(-8px) scale(.985) !important;
          transform-origin:top center !important;
          transition:opacity .25s ease, transform .28s ease, visibility .25s ease !important;
          z-index:30 !important;
  }
  .nav-card.menu-open .menu{
  opacity:1 !important;
          visibility:visible !important;
          pointer-events:auto !important;
          transform:translateY(0) scale(1) !important;
  }
  .nav-card .menu a{
  width:100% !important;
          padding:12px 14px !important;
          border-radius:12px !important;
          text-align:right !important;
          font-size:12px !important;
          color:#31445d !important;
          background:transparent !important;
  }
  .nav-card .menu a:hover,
  .nav-card .menu a:active{
  background:#f2f7ff !important;
          color:#1675f7 !important;
  }
  .nav-card .menu a:after{
  display:none !important;
  }
}

@keyframes ctaFloat{
      0%,100%{transform:translateY(0) rotate(-5deg)}
      50%{transform:translateY(-10px) rotate(5deg)}
    }

@keyframes ctaFloatStep31{
      0%,100%{transform:translateY(0)}
      50%{transform:translateY(8px)}
    }

@keyframes serviceFloatA{
      0%,100%{transform:translateY(0) rotate(-8deg)}
      50%{transform:translateY(-11px) rotate(-3deg)}
    }

@keyframes serviceFloatB{
      0%,100%{transform:translateY(0) rotate(-5deg)}
      50%{transform:translateY(-13px) rotate(1deg)}
    }

@keyframes serviceFloatC{
      0%,100%{transform:translateY(0) rotate(6deg)}
      50%{transform:translateY(-10px) rotate(2deg)}
    }

/* متغیرهای طرح خانه — فقط داخل ناحیهٔ کروم، تا استایل محتوای پنل/صفحات عوض نشود */
:root {
    --blue-2: #0d5edf; --blue-3: #25a8ff; --soft: #eef6ff; --soft-2: #f7fbff;
    --promo: #d8f3fb; --shadow: 0 12px 30px rgba(29,70,130,.06);
    --radius: 22px; --radius-sm: 16px; --radius-xl: 34px;
}

.promo-shell, .header-wrap, .site-footer {
    --blue: #1772f8; --ink: #1b2d45; --muted: #72809a; --line: #e8eef7;
    --shadow-lg: 0 30px 70px rgba(29,70,130,.13);
    --container: min(1240px, calc(100% - 42px));
}

/* ===== Task 66 — ویجت حساب کاربری هدر (عین پنل کاربر) =====
 * بعد از لاگین، در همهٔ صفحات سایت همان دکمهٔ سفید پنل (نام کاربر + زیرمنو)
 * نمایش داده می‌شود؛ مهمان = دکمهٔ آبی «ورود / ثبت نام» */
.actions-card{overflow:visible}
/* Task 70: نمای نهایی = دقیقاً عین پنل کاربر — دراپ‌داون هم‌عرض دکمه (left/right 4px) با آیتم‌های وسط‌چین و فلش ثابت */
.account-menu-cell{position:relative;display:flex;align-items:center;justify-content:center;padding:4px;direction:rtl;min-width:0}
.account-trigger{width:100%;height:58px;border:1px solid #dfe8f4;border-radius:13px;background:#fff;color:#243a52;padding:0 13px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;font-weight:700;white-space:nowrap;cursor:pointer;font-family:inherit}
.account-trigger:hover{background:#f9fbfe;border-color:#cfddec}
.account-trigger .acct-name{overflow:hidden;text-overflow:ellipsis;min-width:0}
.account-trigger .acct-chev{width:16px;height:16px;flex:0 0 16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.account-dropdown{position:absolute;top:calc(100% + 8px);left:4px;right:4px;width:auto;background:#fff;border:1px solid #e5ebf3;border-radius:12px;box-shadow:0 16px 36px rgba(29,70,130,.13);overflow:hidden;opacity:0;visibility:hidden;transform:translateY(-6px);transition:.18s;z-index:120}
.account-menu-cell.open .account-dropdown{opacity:1;visibility:visible;transform:none}
.account-dropdown a{min-height:46px;width:100%;padding:0 13px;display:flex;align-items:center;justify-content:center;gap:8px;color:#46596f;font-size:13px;font-weight:600;border-bottom:1px solid #eef2f7;text-align:center;direction:rtl;line-height:1.4}
.account-dropdown a:last-child{border-bottom:0}
.account-dropdown a:hover{background:#f7faff;color:#1772f8}
.account-dropdown a svg{width:18px;height:18px;flex:0 0 18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.account-dropdown a span{flex:0 0 auto;text-align:center;white-space:nowrap}
.logout-menu-item:hover{color:#d84e60!important;background:#fff7f8!important}

@media (max-width:860px){
  .actions-card,
  .actions-card.mobile-bottom-mounted{overflow:visible !important}
  .account-trigger{font-size:12px;height:56px}
  .actions-card .account-dropdown{top:auto !important;bottom:calc(100% + 8px) !important;left:4px !important;right:4px !important;width:auto !important;z-index:10020 !important}
}
@media (max-width:620px){
  .account-trigger{font-size:11.5px;padding:0 9px}
  .account-dropdown a{min-height:44px;font-size:12.5px}
}