/* Zero-burning static layout (blocking on home). Must match zero-burning-section.html before JS inject. */
.gle-zb {
  --gle-green: #1b6e2e;
  --gle-green-deep: #0f3d1a;
  --gle-yellow: #f5c518;
  --gle-ink: #13261a;
  --gle-ink-soft: #2f4637;
  --gle-card: rgba(255, 255, 255, 0.72);
  --gle-chip: rgba(27, 110, 46, 0.10);
  --gle-sky: #9cc0f2;
  --gle-font: "Poppins", "Segoe UI", system-ui, -apple-system, sans-serif;
  --gle-urdu: "Noto Nastaliq Urdu", "Jameel Noori Nastaleeq", serif;
  position: relative;
  width: 100%;
  height: clamp(620px, 88vh, 860px);
  overflow: hidden;
  background: var(--gle-sky);
  font-family: var(--gle-font);
  color: var(--gle-ink);
  isolation: isolate;
  box-sizing: border-box;
}
.gle-zb *, .gle-zb *::before, .gle-zb *::after { box-sizing: border-box; }
.gle-zb__scene {
  position: absolute;
  inset: 0;
  z-index: 0;
  transform-origin: 52% 42%;
}
.gle-zb img.gle-zb__photo {
  position: absolute;
  left: 0;
  right: 0;
  top: -2px;
  bottom: -2px;
  width: 100%;
  height: calc(100% + 4px);
  max-width: none;
  object-fit: cover;
  object-position: 60% 45%;
  z-index: 0;
}
.gle-zb canvas.gle-zb__gl {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 0;
  opacity: 0;
  pointer-events: none;
}
.gle-zb canvas.gle-zb__gl.is-on { opacity: 1; pointer-events: auto; }
.gle-zb canvas.gle-zb__fx {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
}
.gle-zb__film { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.gle-zb__wrap {
  position: relative;
  z-index: 5;
  height: 100%;
  max-width: none;
  margin: 0;
  padding-left: max(clamp(16px, 2.2vw, 36px), env(safe-area-inset-left, 0px));
  padding-right: max(20px, env(safe-area-inset-right, 0px));
  padding-block: clamp(16px, 3vh, 30px);
  display: flex;
  align-items: flex-start;
  pointer-events: none;
  opacity: 1;
}
.gle-zb[data-gl-zb-ssr="1"] .gle-zb__wrap,
.gle-zb.is-ready-fallback .gle-zb__wrap {
  opacity: 1;
  pointer-events: none;
}
.gle-zb__card {
  pointer-events: auto;
  width: min(450px, 100%);
  background: var(--gle-card);
  -webkit-backdrop-filter: blur(10px) saturate(1.2);
  backdrop-filter: blur(10px) saturate(1.2);
  border-radius: 22px;
  padding: clamp(18px, 2.2vw, 26px);
  box-shadow: 0 18px 50px rgba(15, 61, 26, 0.18);
  display: flex;
  flex-direction: column;
  gap: 11px;
}
.gle-zb__brand-headline {
  position: absolute;
  z-index: 7;
  pointer-events: none;
  top: max(clamp(10px, 1.8vh, 22px), env(safe-area-inset-top, 0px));
  left: max(12px, env(safe-area-inset-left, 0px));
  right: max(12px, env(safe-area-inset-right, 0px));
  width: auto;
  max-width: none;
  margin: 0;
  text-align: center;
  direction: ltr;
}
@media (min-width: 761px) {
  .gle-zb__wrap {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: auto;
    height: auto;
    align-items: flex-end;
    justify-content: flex-start;
    padding: 0 max(clamp(16px, 2.2vw, 36px), env(safe-area-inset-left, 0px)) clamp(20px, 3vh, 36px);
    padding-right: max(clamp(16px, 2.2vw, 36px), env(safe-area-inset-right, 0px));
  }
  .gle-zb__card { width: min(480px, 44vw); max-width: 480px; }
  .gle-zb__brand-headline {
    max-width: min(720px, 92%);
    margin-inline: auto;
  }
}
@media (max-width: 760px) {
  .gle-zb {
    height: auto;
    min-height: max(640px, 100svh);
  }
  .gle-zb__wrap {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: auto;
    height: auto;
    padding: 0 max(10px, env(safe-area-inset-left, 0px)) max(10px, env(safe-area-inset-bottom, 0px));
    padding-right: max(10px, env(safe-area-inset-right, 0px));
    justify-content: stretch;
    align-items: stretch;
  }
  .gle-zb__card {
    width: 100%;
    max-height: min(340px, 40svh);
    background: rgba(255, 255, 255, 0.94);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}
body.home .gle-home-section--zero-burning,
body.home .gle-fse-block.gle-home-section--zero-burning {
  min-height: clamp(620px, 88vh, 860px);
  contain: layout;
}
