/* c2-lattice: the lattice sits above c2's light field and below the page, so the glass slabs float in front of it. */
#lattice { position: fixed; inset: 0; width: 100vw; height: 100vh; z-index: 0; pointer-events: none; opacity: 0; transition: opacity 1.6s var(--ease, ease); }
.lattice-live #lattice { opacity: var(--lo, 1); }
/* after the first fade the scroll-driven --lo must track directly, not restart a 1.6 s transition every frame */
.lattice-settled #lattice { transition: none; }
/* hero: the lattice is a crystal held inside the front glass slab; the mask opens as the page scrolls (JS sets --lx/--ly/--lr) */
#lattice {
  -webkit-mask-image: radial-gradient(circle var(--lr, 200vmax) at var(--lx, 50%) var(--ly, 50%), #000 62%, transparent 100%);
          mask-image: radial-gradient(circle var(--lr, 200vmax) at var(--lx, 50%) var(--ly, 50%), #000 62%, transparent 100%);
}