/* t4030 + t4032 + t4045: identical header/footer on every page; header only is fixed.
   Footer stays in normal flow at the end of the page. No slim bottom bar.
   Loaded last in the document AND inside ag-site-header / ag-site-footer shadows.
   All shell sizes are px (not rem / --font-scale) so html font-size and
   page sheets cannot change them. Animations are left untouched. */

/* ---- Document: scrollbar + anchor padding ---- */
html {
  scrollbar-gutter: stable;
  scroll-padding-top: var(--ag-header-h, 88px);
}
html body#ag-unified-site {
  --ag-header-h: 88px;
  --ag-footer-h: 372px;
  padding-top: var(--ag-header-h) !important;
  box-sizing: border-box !important;
}
html body#ag-unified-site #main,
html body#ag-unified-site #main [id],
html body#ag-unified-site #main h1,
html body#ag-unified-site #main h2,
html body#ag-unified-site #main h3,
html body#ag-unified-site #main [name] {
  scroll-margin-top: calc(var(--ag-header-h, 88px) + 12px);
}

/* ---- Host: fixed header (beats :host{all:initial} and overflow-x:clip) ---- */
ag-site-header,
:host(ag-site-header) {
  position: fixed !important;
  top: var(--ag-card-inset-top, 0px) !important;
  left: var(--ag-card-inset-left, 0px) !important;
  right: var(--ag-card-inset-right, 0px) !important;
  width: auto !important;
  max-width: none !important;
  z-index: 400 !important;
  display: block !important;
  height: 88px !important;
  min-height: 88px !important;
  max-height: 88px !important;
  margin: 0 !important;
  padding: 0 !important;
  flex: none !important;
  zoom: 1 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  overflow-x: visible !important;
  overflow-y: visible !important;
  /* inset shorthand must not override top/left/right card insets */
  bottom: auto !important;
  transform: none !important;
  float: none !important;
}

/* ---- Host: footer stays in flow, locked height ---- */
ag-site-footer,
:host(ag-site-footer) {
  position: relative !important;
  inset: auto !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 372px !important;
  min-height: 372px !important;
  max-height: 372px !important;
  margin: 0 !important;
  padding: 0 !important;
  flex: none !important;
  zoom: 1 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  z-index: 0 !important;
  transform: none !important;
}

/* ---- Inner header (shadow) ---- */
:host(ag-site-header) .sb-h,
.sb-h {
  height: 88px !important;
  min-height: 88px !important;
  max-height: 88px !important;
  box-sizing: border-box !important;
  font-family: Inter, "Noto Sans Bengali", sans-serif !important;
  font-size: 14px !important;
  line-height: 20px !important;
  zoom: 1 !important;
}
:host(ag-site-header) .sb-w,
.sb-h .sb-w {
  height: 88px !important;
  width: calc(100% - 80px) !important;
  max-width: 1372px !important;
  margin: 0 auto !important;
  display: flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
}
:host(ag-site-header) .sb-logo img,
.sb-h .sb-logo img {
  height: 48px !important;
  width: auto !important;
  max-width: none !important;
  max-height: 48px !important;
  object-fit: contain !important;
  object-position: left center !important;
}
:host(ag-site-header) .sf-link,
:host(ag-site-header) .mb,
:host(ag-site-header) .sb-lang,
.sb-h .sf-link,
.sb-h .mb,
.sb-h .sb-lang {
  font-size: 14px !important;
  line-height: 20px !important;
  font-family: Inter, "Noto Sans Bengali", sans-serif !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}
:host(ag-site-header) .sf-front,
:host(ag-site-header) .sf-back,
.sb-h .sf-front,
.sb-h .sf-back {
  line-height: 20px !important;
  font-size: 14px !important;
}

/* ---- Inner footer (shadow) ----
   Isolated-shell later sets grid-template-rows:auto auto auto and height:auto on
   .sb-fw. EN legal-copy needs ~345px; we lock one height that fits both locales
   and never clip. */
:host(ag-site-footer) .sb-f,
.sb-f {
  height: 372px !important;
  min-height: 372px !important;
  max-height: 372px !important;
  box-sizing: border-box !important;
  font-family: Inter, "Noto Sans Bengali", sans-serif !important;
  font-size: 14.4px !important;
  line-height: 20.88px !important;
  zoom: 1 !important;
  overflow: visible !important;
}
:host(ag-site-footer) .sb-fw,
.sb-f .sb-fw {
  display: grid !important;
  grid-template-columns: 240px minmax(0, 1fr) !important;
  grid-template-rows: auto auto auto !important;
  align-content: start !important;
  width: calc(100% - 80px) !important;
  max-width: 1372px !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: 24px 0 18px !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}
:host(ag-site-footer) .sb-flogo img,
.sb-f .sb-flogo img {
  height: 64px !important;
  width: auto !important;
  max-width: 260px !important;
  max-height: 64px !important;
  object-fit: contain !important;
}
:host(ag-site-footer) .sb-ftag,
:host(ag-site-footer) .c h4,
:host(ag-site-footer) .c a,
:host(ag-site-footer) .c .muted,
:host(ag-site-footer) .c span,
:host(ag-site-footer) .sb-copy,
.sb-f .sb-ftag,
.sb-f .c h4,
.sb-f .c a,
.sb-f .c .muted,
.sb-f .c span,
.sb-f .sb-copy {
  font-size: 14.4px !important;
  line-height: 1.45 !important;
  font-family: Inter, "Noto Sans Bengali", sans-serif !important;
}

/* Tablet / laptop: existing 1279 breakpoint (burger replaces nav) */
@media (max-width: 1279px) {
  html body#ag-unified-site { --ag-header-h: 72px; }
  ag-site-header,
  :host(ag-site-header) {
    height: 72px !important;
    min-height: 72px !important;
    max-height: 72px !important;
  }
  :host(ag-site-header) .sb-h,
  :host(ag-site-header) .sb-w,
  .sb-h,
  .sb-h .sb-w {
    height: 72px !important;
    min-height: 72px !important;
    max-height: 72px !important;
  }
  :host(ag-site-header) .sb-w,
  .sb-h .sb-w {
    width: calc(100% - 48px) !important;
  }
  :host(ag-site-header) .sb-logo img,
  .sb-h .sb-logo img {
    height: 44px !important;
    max-height: 44px !important;
  }
}

/* Phone card (mobile-lock body margin ~16–20px at ≤768). Keep the fixed
   header aligned with that card so it does not jump to a larger full-bleed size. */
@media (max-width: 768px) {
  html body#ag-unified-site.l-en,
  html body#ag-unified-site.l-bn,
  html body#ag-unified-site[id] {
    --ag-header-h: 72px;
  }
  html body#ag-unified-site:not(.ops) ag-site-header {
    /* Only inset when the page actually uses the mobile-lock card (body margin).
       Pages without that card stay full-bleed, same 72px height. */
  }
}

/* Mobile footer: 4-row grid (logo, tagline, columns, copyright). Height fits EN. */
@media (max-width: 700px) {
  html body#ag-unified-site { --ag-footer-h: 816px; }
  ag-site-footer,
  :host(ag-site-footer) {
    height: 816px !important;
    min-height: 816px !important;
    max-height: 816px !important;
  }
  :host(ag-site-footer) .sb-f,
  .sb-f {
    height: 816px !important;
    min-height: 816px !important;
    max-height: 816px !important;
    overflow: visible !important;
  }
  :host(ag-site-footer) .sb-fw,
  .sb-f .sb-fw {
    width: calc(100% - 48px) !important;
    padding: 24px 0 20px !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto auto auto !important;
    gap: 8px !important;
    height: auto !important;
  }
  :host(ag-site-footer) .sb-flogo,
  .sb-f .sb-flogo { grid-area: 1 / 1 !important; }
  :host(ag-site-footer) .sb-ftag,
  .sb-f .sb-ftag { grid-area: 2 / 1 !important; margin: 0 !important; }
  :host(ag-site-footer) .sb-fcols,
  .sb-f .sb-fcols { grid-area: 3 / 1 !important; grid-column: 1 !important; grid-row: 3 !important; }
  :host(ag-site-footer) .sb-copy,
  .sb-f .sb-copy { grid-area: 4 / 1 !important; }
  :host(ag-site-footer) .sb-flogo img,
  .sb-f .sb-flogo img {
    height: 52px !important;
    max-height: 52px !important;
    max-width: 100% !important;
  }
}

@media (max-width: 400px) {
  :host(ag-site-header) .sb-w,
  .sb-h .sb-w {
    width: calc(100% - 16px) !important;
    gap: 6px !important;
  }
  :host(ag-site-header) .sb-logo img,
  .sb-h .sb-logo img {
    height: 40px !important;
    max-height: 40px !important;
    max-width: 100% !important;
  }
}

/* Mobile-lock card: if body has a side margin, pin the header to the card. */
@media (max-width: 768px) {
  html body#ag-unified-site {
    --ag-card-inset: 0px;
  }
}
/* mobile-lock sets body margin only at max-width 768 AND only when that sheet is loaded.
   We detect it via the computed margin by not guessing; instead we use a conservative
   inset of 0 so height stays 72px everywhere. Width follows the page. */

/* Keep chrome inside the layout box (100vw would overflow the scrollbar). */
ag-site-footer,
:host(ag-site-footer) {
  max-width: 100% !important;
}