/* ---------- Seamless sections ----------
   Every section sits on the same paper colour and fades to transparent at its top and bottom,
   so the fixed mint backdrop (style.css .bg) shows through where two sections meet — they melt
   into each other instead of butting up with a hard edge. */
:root { --page: #f2f2ee; --page-0: rgba(242, 242, 238, 0); --blend: 26vh; }

body { background: var(--page); }

.jungle, .me, .lab, .why, .stack {
  background: linear-gradient(to bottom,
    var(--page-0) 0, var(--page) var(--blend),
    var(--page) calc(100% - var(--blend)), var(--page-0) 100%) !important;
}
/* pinned stages / inner layers must not paint their own solid block */
.jungle__stage { background: transparent !important; }

/* toolkit scanlines fade out with the section edges */
.stack::after {
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 var(--blend), #000 calc(100% - var(--blend)), transparent);
  mask-image: linear-gradient(to bottom, transparent, #000 var(--blend), #000 calc(100% - var(--blend)), transparent);
}

/* footer: the beige paper and its graph grid fade in instead of starting on a line */
.foot {
  isolation: isolate;
  padding-top: calc(var(--blend) * .6) !important;
  background: linear-gradient(to bottom, var(--page-0) 0, var(--f-paper) var(--blend)) !important;
}
.foot::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(rgba(18, 64, 43, .07) 1px, transparent 1px) 0 0 / 14px 14px,
    linear-gradient(90deg, rgba(18, 64, 43, .07) 1px, transparent 1px) 0 0 / 14px 14px;
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 var(--blend));
  mask-image: linear-gradient(to bottom, transparent, #000 var(--blend));
}

/* the branch layers stop at the stage edges — fade them in/out so there's no cut line */
.jungle__scene, .jungle__grain {
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 22%, #000 78%, transparent 100%);
  mask-image: linear-gradient(to bottom, transparent 0, #000 22%, #000 78%, transparent 100%);
}