/* contact page: the lantern - a spotlight follows the cursor through the dark */
.court {
  position: relative;
  min-height: calc(100svh - 8rem);
  display: flex; flex-direction: column; justify-content: center; align-items: center;
  text-align: center;
  padding: 8rem 2rem 4rem;
}
.court h1 {
  font-family: var(--serif);
  font-variation-settings: "opsz" 144, "SOFT" 0, "WONK" 1;
  font-weight: 600;
  font-size: clamp(2.2rem, 6vw, 4rem);
  margin-bottom: 1.2rem;
}
.court__sub { color: var(--paper-dim); max-width: 36rem; margin-bottom: 3rem; }
.court__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 1.2rem; }
.court__link {
  font-family: var(--mono); font-size: 0.9rem; letter-spacing: 0.04em;
  color: var(--paper); text-decoration: none;
  border: 1px solid var(--hairline); padding: 0.8rem 1.4rem; border-radius: 999px;
  transition: border-color 0.3s, transform 0.3s, color 0.3s;
}
.court__link:hover { border-color: var(--gold); color: var(--gold); transform: translateY(-2px); }
.court__tip { margin-top: 3.5rem; color: var(--paper-dim); }

/* the darkness */
.shade {
  position: fixed; inset: 0; z-index: 5; pointer-events: none;
  --x: 50%; --y: 45%;
  background: radial-gradient(circle 170px at var(--x) var(--y),
    rgba(23,19,15,0) 0%,
    rgba(23,19,15,0.55) 55%,
    rgba(23,19,15,0.96) 100%);
  transition: opacity 0.6s;
}
body.no-lantern .shade { opacity: 0; }
.court h1, .court__sub, .court__links, .court .kicker { animation: flicker 3s ease; }
@keyframes flicker {
  0% { opacity: 0; } 40% { opacity: 0.2; } 55% { opacity: 0.5; }
  60% { opacity: 0.3; } 100% { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .shade { opacity: 0; }
  .court h1, .court__sub, .court__links, .court .kicker { animation: none; }
}

/* currently + good asks */
.court__now, .court__ask {
  max-width: 36rem;
  border: 1px solid var(--hairline);
  padding: 1.6rem 1.8rem;
  margin-bottom: 1.4rem;
  background: rgba(31, 26, 21, 0.72);
  text-align: left;
}
.court__now p:last-child, .court__ask p:last-child { color: var(--paper-dim); font-size: 1.05rem; }
.court__now .kicker, .court__ask .kicker { margin-bottom: 0.6rem; }
.court__links { margin: 1.6rem 0 2.6rem; }