.close{
  --side:clamp(1.25rem,4vw,3.5rem);
  position:relative;
  display:flex;flex-direction:column;
  padding:0 var(--side);
  overflow:hidden;isolation:isolate;
  background:var(--foreground);color:oklch(0.985 0 0);
}
/* soft light that follows the cursor */
.close-glow{
  position:absolute;inset:-20%;z-index:-1;pointer-events:none;
  background:radial-gradient(38rem 38rem at var(--mx,50%) var(--my,32%),
    oklch(1 0 0 / .13) 0%, oklch(1 0 0 / .05) 34%, transparent 62%);
  transition:opacity .5s;
}
.close-grid{
  position:absolute;inset:0;z-index:-2;pointer-events:none;
  background-image:
    linear-gradient(oklch(1 0 0 / .05) 1px, transparent 1px),
    linear-gradient(90deg, oklch(1 0 0 / .05) 1px, transparent 1px);
  background-size:clamp(3rem,6vw,5rem) clamp(3rem,6vw,5rem);
  -webkit-mask-image:radial-gradient(80% 70% at 50% 40%,#000,transparent);
  mask-image:radial-gradient(80% 70% at 50% 40%,#000,transparent);
}

.close-stage{
  flex:1;display:flex;flex-direction:column;justify-content:center;
  align-items:center;text-align:center;
  padding:clamp(5rem,13vh,9rem) 0 clamp(4rem,10vh,7rem);
}

.close h2{
  margin:0;color:#fff;max-width:16ch;
  font-size:clamp(2rem,6.4vw,5.25rem);
  font-weight:600;line-height:1.02;letter-spacing:-.035em;
}
.close h2 .dim{color:oklch(1 0 0 / .42);}
.close-sub{
  margin:clamp(1.125rem,2.5vh,1.75rem) 0 0;max-width:42ch;
  color:oklch(1 0 0 / .68);
  font-size:clamp(.9375rem,1.4vw,1.125rem);line-height:1.55;
}
.close-acts{
  display:flex;flex-wrap:wrap;justify-content:center;
  gap:.75rem;margin-top:clamp(1.75rem,4vh,2.75rem);
}
.luma-btn.invert{background:#fff;color:var(--foreground);}
.luma-btn.invert:hover{background:oklch(.9 0 0);}
.close-fine{
  margin:clamp(1rem,2.5vh,1.5rem) 0 0;
  color:oklch(1 0 0 / .45);font-size:.75rem;
}