/* /business: the hero's window decal on a pane of glass, and the guest Wi‑Fi list. Builds on landing.css and churches.css. */
.decal-stage { padding-top: 20px; }
.pane {
  position: relative; z-index: 2; width: min(340px, 86vw); aspect-ratio: 4 / 4.4; border-radius: 6px; display: grid; place-items: center; overflow: hidden;
  background:
    linear-gradient(115deg, rgba(255,255,255,0) 30%, rgba(255,255,255,.55) 42%, rgba(255,255,255,0) 54%) -220px 0 / 200% 100% no-repeat,
    linear-gradient(160deg, #cfe4ea 0%, #e7f1ee 46%, #d7e6e2 100%);
  box-shadow: 0 0 0 10px #2b2f36, 0 0 0 11px #1a1d22, 0 40px 70px -28px rgba(22,33,58,.55);
  animation: pane-glint 5.5s ease-in-out 1.2s infinite;
}
.pane::after { content: ""; position: absolute; inset: auto 0 0; height: 34%; background: linear-gradient(transparent, rgba(22,33,58,.08)); }
@keyframes pane-glint { 0%, 55% { background-position: -220px 0, 0 0; } 85%, 100% { background-position: 380px 0, 0 0; } }
.decal { position: relative; width: 76%; aspect-ratio: 1; border-radius: 50%; background: #fff; color: var(--ink);
  box-shadow: 0 1px 0 rgba(255,255,255,.8) inset, 0 10px 30px -14px rgba(22,33,58,.45);
  animation: decal-on 1.1s cubic-bezier(.2,1.3,.4,1) .25s both; }
@keyframes decal-on { from { transform: scale(.82) rotate(-14deg); opacity: 0; } to { transform: none; opacity: 1; } }
.decal-ring { position: absolute; inset: 0; width: 100%; height: 100%; animation: decal-spin 60s linear infinite; }
.decal-ring text { font: 700 12.2px var(--font); letter-spacing: .2em; fill: var(--brand-ink, #146b4f); }
@keyframes decal-spin { to { transform: rotate(360deg); } }
.decal-core { position: absolute; inset: 22%; border-radius: 50%; border: 2px solid var(--ink); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 4px; padding: 8px; }
.decal-core img { width: 34px; height: 34px; }
.decal-core b { font: 500 clamp(22px, 6vw, 28px)/1 var(--serif, Georgia, serif); letter-spacing: -0.02em; }
.decal-core span { font-size: 11.5px; font-weight: 600; color: var(--ink-3); line-height: 1.2; }
.guests { margin-top: 30px; }
@media (max-width: 420px) { .decal-ring text { font-size: 11.5px; } }
@media (prefers-reduced-motion: reduce) { .pane, .decal, .decal-ring { animation: none; } }
