/**
 * ACG Responsive Foundation
 * Loaded after all project stylesheets.
 */

/* =========================================================
   1. Global responsive safety
   ========================================================= */

:root{
  --acg-mobile-gutter:18px;
  --acg-mobile-nav-height:74px;
}

html{
  width:100%;
  max-width:100%;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

body.acg-site{
  width:100%;
  min-width:320px;
  max-width:100%;
  overflow-x:clip;
}

body.acg-site main,
body.acg-site section,
body.acg-site header,
body.acg-site footer{
  min-width:0;
  max-width:100%;
}

body.acg-site main{
  width:100%;
  overflow-x:clip;
}

body.acg-site img,
body.acg-site picture,
body.acg-site video,
body.acg-site svg,
body.acg-site canvas,
body.acg-site iframe{
  max-width:100%;
}

body.acg-site picture{
  display:block;
}

body.acg-site input,
body.acg-site select,
body.acg-site textarea,
body.acg-site button{
  max-width:100%;
  font-family:Shabnam,Tahoma,sans-serif;
}

body.acg-site h1,
body.acg-site h2,
body.acg-site h3,
body.acg-site p,
body.acg-site a,
body.acg-site span{
  overflow-wrap:anywhere;
}

.zw-container,
.acg-container,
.container{
  min-width:0;
}


/* =========================================================
   2. Tablet and mobile foundation
   ========================================================= */

@media(max-width:1024px){

  body.acg-site{
    padding-bottom:
      calc(
        var(--acg-mobile-nav-height)
        + env(safe-area-inset-bottom, 0px)
      );
  }

  .acg-mobile-bottom{
    height:
      calc(
        var(--acg-mobile-nav-height)
        + env(safe-area-inset-bottom, 0px)
      ) !important;

    padding-bottom:
      env(safe-area-inset-bottom, 0px);
  }

  .acg-drawer{
    height:100vh !important;
    height:100dvh !important;
  }

  body.acg-site input,
  body.acg-site select,
  body.acg-site textarea{
    font-size:16px;
  }

  body.acg-site button,
  body.acg-site a{
    -webkit-tap-highlight-color:transparent;
  }

  /* Hero must become content-driven, not scaled desktop */
  .acg-hero-main{
    height:auto !important;
    min-height:calc(100svh - 72px) !important;
    max-height:none !important;
  }

  .acg-hero-content{
    height:auto !important;
    min-height:inherit !important;
  }
}


/* =========================================================
   3. Real mobile Hero layout
   ========================================================= */

@media(max-width:767px){

  :root{
    --acg-mobile-gutter:18px;
  }

  .zw-container,
  .acg-container,
  .container{
    width:calc(100% - 36px) !important;
    max-width:none !important;
    margin-right:auto !important;
    margin-left:auto !important;
  }

  .acg-hero-main{
    min-height:calc(100svh - 72px) !important;
    background:#022041;
  }

  .acg-hero-media img{
    object-position:center center;
  }

  .acg-hero-overlay{
    background:
      linear-gradient(
        180deg,
        rgba(2,32,65,.20) 0%,
        rgba(2,32,65,.55) 38%,
        rgba(2,32,65,.94) 78%,
        #022041 100%
      ) !important;
  }

  .acg-hero-content{
    min-height:calc(100svh - 72px) !important;
    padding:
      44px
      var(--acg-mobile-gutter)
      30px !important;

    align-items:stretch !important;
    justify-content:flex-end !important;
    gap:12px !important;
    text-align:right !important;
  }

  .acg-hero-kicker{
    align-self:flex-start;
    max-width:100%;
    padding:7px 11px;
    font-size:11px;
    line-height:1.6;
  }

  .acg-hero-content h1{
    width:100%;
    max-width:none;
    font-size:clamp(1.75rem,8vw,2.5rem);
    line-height:1.45;
    text-align:right;
  }

  .acg-hero-content h1 span{
    display:block !important;
    margin-top:8px;
    font-size:clamp(.88rem,3.8vw,1rem);
    font-weight:600;
    line-height:1.95;
  }

  .acg-hero-desc{
    display:block !important;
    width:100%;
    max-width:none !important;
    margin:0;
    overflow:visible !important;
    -webkit-line-clamp:unset !important;
    font-size:clamp(.88rem,3.7vw,.98rem);
    line-height:2;
    text-align:right;
  }

  .acg-hero-actions{
    width:100%;
    margin-top:8px;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:9px !important;
  }

  .acg-hero-btn{
    width:100%;
    min-width:0 !important;
    min-height:48px;
    padding:11px 16px !important;
    font-size:.93rem;
    white-space:normal;
  }
}


/* =========================================================
   4. Small phones
   ========================================================= */

@media(max-width:420px){

  :root{
    --acg-mobile-gutter:15px;
  }

  .zw-container,
  .acg-container,
  .container{
    width:calc(100% - 30px) !important;
  }

  .acg-hero-content{
    padding-top:34px !important;
    padding-bottom:24px !important;
  }

  .acg-hero-content h1{
    font-size:clamp(1.55rem,8vw,2rem);
  }

  .acg-hero-content h1 span{
    font-size:.86rem;
  }

  .acg-hero-desc{
    font-size:.86rem;
    line-height:1.95;
  }

  .acg-hero-btn{
    min-height:46px;
    font-size:.88rem;
  }
}


/* =========================================================
   5. Safe-area support
   ========================================================= */

@supports(padding:max(0px)){

  @media(max-width:767px){

    .acg-hero-content{
      padding-right:
        max(
          var(--acg-mobile-gutter),
          env(safe-area-inset-right)
        ) !important;

      padding-left:
        max(
          var(--acg-mobile-gutter),
          env(safe-area-inset-left)
        ) !important;
    }
  }
}

/* =========================================================
   ACG Mobile Account Icon — Force Fix V2
   ========================================================= */

@media(max-width:1024px){

  /* حذف کامل آیکون همبرگر قدیمی */
  .acg-main::before{
    content:none !important;
    display:none !important;
    visibility:hidden !important;
    width:0 !important;
    height:0 !important;
    border:0 !important;
    pointer-events:none !important;
  }

  /* دکمه واقعی حساب کاربری */
  .acg-main > .acg-mobile-account{
    grid-column:1 !important;
    grid-row:1 !important;

    width:40px !important;
    height:40px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    justify-self:start !important;
    align-self:center !important;

    position:relative !important;
    z-index:50 !important;

    border:1px solid #dce5ef !important;
    background:#fff !important;
    color:#022041 !important;

    text-decoration:none !important;
    pointer-events:auto !important;
  }

  /* برای جلوگیری از تداخل Font Awesome قبلی */
  .acg-main > .acg-mobile-account > i{
    display:none !important;
  }

  /* آیکون قطعی حساب کاربری */
  .acg-main > .acg-mobile-account::before{
    content:"\f007" !important;

    display:block !important;
    visibility:visible !important;

    width:auto !important;
    height:auto !important;

    font-family:"Font Awesome 6 Free" !important;
    font-weight:900 !important;
    font-size:17px !important;
    line-height:1 !important;

    color:currentColor !important;
    border:0 !important;
    background:none !important;
  }

  /* نقطه آبی کوچک وضعیت */
  .acg-main > .acg-mobile-account::after{
    content:"" !important;

    position:absolute !important;
    right:6px !important;
    bottom:5px !important;

    width:6px !important;
    height:6px !important;

    display:block !important;
    visibility:visible !important;

    border:2px solid #fff !important;
    border-radius:50% !important;
    background:#0c53a5 !important;
  }

  .acg-main > .acg-mobile-account.is-active{
    color:#fff !important;
    border-color:#0c53a5 !important;
    background:#0c53a5 !important;
  }

  .acg-main > .acg-mobile-account.is-active::after{
    background:#fff !important;
    border-color:#0c53a5 !important;
  }
}

/* =========================================================
   Header Request Button — Final Color Fix
   ========================================================= */

.acg-h .acg-actions .acg-btn.acg-btn--primary,
.acg-h .acg-actions .acg-btn.acg-btn--primary:link,
.acg-h .acg-actions .acg-btn.acg-btn--primary:visited{
  background:#0c53a5 !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  border-color:#0c53a5 !important;
}

.acg-h .acg-actions .acg-btn.acg-btn--primary:hover,
.acg-h .acg-actions .acg-btn.acg-btn--primary:focus,
.acg-h .acg-actions .acg-btn.acg-btn--primary:focus-visible{
  background:#ffffff !important;
  color:#022041 !important;
  -webkit-text-fill-color:#022041 !important;
  border-color:#022041 !important;
}

.acg-h .acg-actions .acg-btn.acg-btn--primary:active{
  background:#eef4fa !important;
  color:#022041 !important;
  -webkit-text-fill-color:#022041 !important;
  border-color:#022041 !important;
}
